@font-face{font-family:"DM Serif Display";src:url("../../assets/fonts/dm-serif-display-latin.woff2") format("woff2");font-display:swap;font-style:normal;font-weight:400}
@font-face{font-family:"Inter";src:url("../../assets/fonts/inter-latin.woff2") format("woff2");font-display:swap;font-style:normal;font-weight:100 900}
@font-face{font-family:"IBM Plex Mono";src:url("../../assets/fonts/ibm-plex-mono-400-latin.woff2") format("woff2");font-display:swap;font-style:normal;font-weight:400}
@font-face{font-family:"IBM Plex Mono";src:url("../../assets/fonts/ibm-plex-mono-500-latin.woff2") format("woff2");font-display:swap;font-style:normal;font-weight:500}

:root{
  --bg:#fafaf9;--surface:#fff;--surface-alt:#f4f3f0;--ink:#141b24;--ink-2:#4a5460;--ink-3:#707985;
  --brand:#2c61b4;--brand-deep:#113256;--brand-soft:#719ada;--brand-wash:#eaf0f9;--accent:#00a7c4;
  --line:rgba(17,50,86,.11);--line-2:rgba(17,50,86,.18);--shadow:0 16px 44px -28px rgba(17,50,86,.28);
  --serif:"DM Serif Display",Georgia,"Times New Roman",serif;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Consolas,monospace;
  --pad:clamp(1rem,4vw,2.5rem);--measure:78ch;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.68;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;height:auto}
a{color:var(--brand);text-decoration-thickness:.08em;text-underline-offset:.17em}
a:hover{color:var(--brand-deep)}
a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.skip-link{position:fixed;left:1rem;top:1rem;z-index:1000;padding:.7rem 1rem;background:var(--brand-deep);color:#fff;transform:translateY(-180%)}
.skip-link:focus{transform:none}

.site-header{position:sticky;top:0;z-index:20;background:rgba(250,250,249,.92);border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}
.nav-wrap{max-width:1180px;margin:auto;padding:.78rem var(--pad);display:flex;align-items:center;justify-content:space-between;gap:1.25rem}
.brand{display:flex;align-items:center;gap:.65rem;color:var(--ink);font-weight:650;text-decoration:none;white-space:nowrap}
.brand img{border-radius:9px}
.nav-wrap nav{display:flex;align-items:center;gap:clamp(.7rem,2.4vw,1.6rem);font-size:.9rem}
.nav-wrap nav>a{color:var(--ink-2);text-decoration:none;white-space:nowrap}
.nav-wrap nav>a:hover,.nav-wrap nav>a[aria-current]{color:var(--ink)}
.nav-wrap .nav-cta{padding:.52rem .8rem;border-radius:8px;background:var(--brand-deep);color:#fff}
.nav-wrap .nav-cta:hover{background:var(--brand);color:#fff}

.page-shell{width:min(100%,1040px);margin:auto;padding:1.2rem var(--pad) 4rem;min-width:0}
.breadcrumbs{font-family:var(--mono);font-size:.72rem;color:var(--ink-3);margin:0 0 clamp(2rem,6vw,4rem)}
.breadcrumbs ol{display:flex;flex-wrap:wrap;gap:.45rem;list-style:none;margin:0;padding:0}
.breadcrumbs li+li::before{content:"/";padding-right:.45rem;color:var(--ink-3)}
.breadcrumbs a{color:var(--ink-2);text-decoration:none}
.article-header,.collection-header{max-width:880px;margin-bottom:clamp(2.8rem,7vw,5rem)}
.collection-header h1{font-size:clamp(1.95rem,7.3vw,4.4rem);letter-spacing:-.035em;white-space:nowrap}
.eyebrow{display:flex;align-items:center;gap:.7rem;margin:0 0 .8rem;font-family:var(--mono);font-size:.7rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--brand)}
.eyebrow::before{content:"";width:1.7rem;height:1px;background:currentColor;opacity:.65}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.08;letter-spacing:-.025em;text-wrap:balance}
h1{font-size:clamp(2.3rem,6vw,4.4rem);margin:0 0 1.2rem}
h2{font-size:clamp(1.7rem,3.4vw,2.5rem);margin:2.8rem 0 1rem;scroll-margin-top:6rem}
h3{font-size:clamp(1.3rem,2.4vw,1.7rem);margin:2.2rem 0 .8rem;scroll-margin-top:6rem}
.lede{max-width:66ch;margin:0 0 1.8rem;color:var(--ink-2);font-size:clamp(1.08rem,1.4vw,1.28rem);line-height:1.58}
.action-row{display:flex;flex-wrap:wrap;gap:.65rem;margin:1.5rem 0}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:.62rem .88rem;border:1px solid var(--line-2);border-radius:9px;background:var(--surface);color:var(--ink);font-size:.84rem;font-weight:600;line-height:1.25;text-decoration:none;box-shadow:0 1px 2px rgba(17,50,86,.03)}
.button:hover{border-color:var(--brand-soft);box-shadow:var(--shadow);color:var(--brand-deep)}
.button.primary{background:var(--brand-deep);border-color:var(--brand-deep);color:#fff}
.button.primary:hover{background:var(--brand);color:#fff}

.notebook{min-width:0;max-width:100%;padding:clamp(1rem,4vw,3rem);border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:var(--shadow)}
.notebook-cell{min-width:0;margin:0 0 1.6rem;scroll-margin-top:6rem}
.notebook-cell:last-child{margin-bottom:0}
.markdown-cell>*:first-child,.output>*:first-child{margin-top:0}
.markdown-cell>*:last-child,.output>*:last-child{margin-bottom:0}
.markdown-cell{width:100%;max-width:var(--measure);min-width:0}
.markdown-cell p,.markdown-cell li{overflow-wrap:anywhere}
.markdown-cell blockquote{margin:1.3rem 0;padding:.1rem 0 .1rem 1.1rem;border-left:3px solid var(--brand-soft);color:var(--ink-2)}
.markdown-cell hr{border:0;border-top:1px solid var(--line);margin:2.2rem 0}
.markdown-cell ul,.markdown-cell ol{padding-left:1.45rem}
.markdown-cell li+li{margin-top:.3rem}
.markdown-cell table{width:max-content;min-width:100%;border-collapse:collapse;font-size:.9rem}
.markdown-cell th,.markdown-cell td{padding:.55rem .7rem;border:1px solid var(--line);text-align:left;vertical-align:top}
.markdown-cell th{background:var(--surface-alt)}
.table-viewport{width:100%;max-width:100%;min-width:0;overflow:hidden;contain:layout paint}
.table-wrap{width:100%;max-width:100%;min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch}
.math-inline{display:inline;overflow:visible;vertical-align:baseline}
.math-display{display:block;max-width:100%;margin:1rem 0;overflow-x:auto;overflow-y:hidden;padding:.25rem 0;contain:inline-size paint}
.katex .katex-mathml{display:block!important;width:1px!important;height:1px!important;overflow:clip!important;clip-path:inset(50%)!important;contain:strict}
math[display="block"]{margin:0 auto}
.anchor-target{display:block;position:relative;top:-5rem;visibility:hidden}

.code-cell{max-width:100%}
.code-disclosure{border:1px solid var(--line);border-radius:12px;background:#f7f8fa;overflow:hidden}
.code-disclosure summary{cursor:pointer;padding:.65rem .78rem;font-family:var(--mono);font-size:.72rem;font-weight:500;color:var(--brand-deep);background:#edf1f6}
.code-disclosure[open] summary{border-bottom:1px solid var(--line)}
.code-input{overflow:hidden}
.cell-label{margin:0;padding:.48rem .78rem;border-bottom:1px solid var(--line);background:#edf1f6;font-family:var(--mono);font-size:.63rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
pre{margin:0;max-width:100%;overflow:auto;padding:1rem;font-family:var(--mono);font-size:clamp(.73rem,1.2vw,.84rem);line-height:1.55;tab-size:4;-webkit-overflow-scrolling:touch}
code{font-family:var(--mono)}
.markdown-cell :not(pre)>code{padding:.12em .34em;border:1px solid var(--line);border-radius:5px;background:var(--surface-alt);font-size:.88em;overflow-wrap:anywhere}
.output{max-width:100%;margin-top:.6rem;border-left:3px solid var(--brand-soft);background:#fbfcfe;overflow:hidden}
.output-label{padding:.35rem .75rem 0;font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3)}
.output pre{white-space:pre;overflow:auto;padding:.65rem .85rem 1rem;color:#253246}
.output-markdown{padding:.7rem .9rem 1rem;overflow-wrap:anywhere}
.output-image{margin:.7rem;padding:.6rem;border:1px solid var(--line);border-radius:10px;background:#fff}
.output-image img{display:block;margin:auto}

.related{margin-top:clamp(3rem,7vw,5rem);padding-top:2rem;border-top:1px solid var(--line)}
.related h2{margin-top:0}
.related ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;list-style:none;padding:0}
.related li{padding:1rem;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.related li>a{display:block;font-family:var(--serif);font-size:1.2rem;line-height:1.15}
.related li>span{display:block;margin-top:.55rem;color:var(--ink-2);font-size:.8rem;line-height:1.5}
.article-footer{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--line);color:var(--ink-3);font-size:.8rem;overflow-wrap:anywhere}
.article-footer code{font-size:.76rem}

.hub-shell{width:min(100%,1180px)}
.collection-header{max-width:900px}
.collection-section{margin:0 0 clamp(4rem,8vw,6rem)}
.collection-section h2{margin:.2rem 0 .7rem}
.section-intro{width:100%;max-width:none;margin:0 0 1.6rem;color:var(--ink-2)}
.notebook-grid{display:grid;grid-template-columns:1fr;gap:1rem}
.notebook-card{display:flex;flex-direction:column;min-width:0;padding:clamp(1.15rem,2.5vw,1.6rem);border:1px solid var(--line);border-radius:15px;background:var(--surface);color:var(--ink);text-decoration:none;box-shadow:0 1px 2px rgba(17,50,86,.03);transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}
.notebook-card:hover{border-color:var(--brand-soft);color:var(--ink);box-shadow:var(--shadow);transform:translateY(-1px)}
.notebook-card h3{margin:0 0 .65rem;font-size:clamp(1.35rem,2.3vw,1.7rem)}
.notebook-card p{margin:0 0 1.1rem;color:var(--ink-2);font-size:.9rem;line-height:1.55}
.notebook-card .text-link{margin-top:auto;font-size:.82rem;font-weight:650;text-decoration:none}

@media(max-width:760px){
  .related ul,.notebook-grid{grid-template-columns:1fr}
  .notebook{padding:1rem;border-radius:14px}
}
@media(max-width:560px){
  .site-header{position:relative}
  .brand span{display:none}
  .nav-wrap{padding-inline:.75rem;gap:.4rem}
  .nav-wrap nav{gap:.55rem;font-size:.76rem}
  .nav-wrap .nav-cta{display:none}
  .page-shell{padding-top:.8rem}
  .breadcrumbs{margin-bottom:2.3rem}
  .action-row{display:grid;grid-template-columns:1fr}
  .button{width:100%}
  h1{font-size:clamp(2.1rem,11vw,3rem);text-wrap:wrap;overflow-wrap:anywhere}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

pre { line-height: 125%; }
td.linenos .normal { color: #666666; background-color: transparent; padding-left: 5px; padding-right: 5px; }
span.linenos { color: #666666; background-color: transparent; padding-left: 5px; padding-right: 5px; }
td.linenos .special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
span.linenos.special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
.highlight .hll { background-color: #ffffcc }
.highlight { background: #f0f0f0; }
.highlight .c { color: #60A0B0; font-style: italic } /* Comment */
.highlight .err { border: 1px solid #F00 } /* Error */
.highlight .k { color: #007020; font-weight: bold } /* Keyword */
.highlight .o { color: #666 } /* Operator */
.highlight .ch { color: #60A0B0; font-style: italic } /* Comment.Hashbang */
.highlight .cm { color: #60A0B0; font-style: italic } /* Comment.Multiline */
.highlight .cp { color: #007020 } /* Comment.Preproc */
.highlight .cpf { color: #60A0B0; font-style: italic } /* Comment.PreprocFile */
.highlight .c1 { color: #60A0B0; font-style: italic } /* Comment.Single */
.highlight .cs { color: #60A0B0; background-color: #FFF0F0 } /* Comment.Special */
.highlight .gd { color: #A00000 } /* Generic.Deleted */
.highlight .ge { font-style: italic } /* Generic.Emph */
.highlight .ges { font-weight: bold; font-style: italic } /* Generic.EmphStrong */
.highlight .gr { color: #F00 } /* Generic.Error */
.highlight .gh { color: #000080; font-weight: bold } /* Generic.Heading */
.highlight .gi { color: #00A000 } /* Generic.Inserted */
.highlight .go { color: #888 } /* Generic.Output */
.highlight .gp { color: #C65D09; font-weight: bold } /* Generic.Prompt */
.highlight .gs { font-weight: bold } /* Generic.Strong */
.highlight .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
.highlight .gt { color: #04D } /* Generic.Traceback */
.highlight .kc { color: #007020; font-weight: bold } /* Keyword.Constant */
.highlight .kd { color: #007020; font-weight: bold } /* Keyword.Declaration */
.highlight .kn { color: #007020; font-weight: bold } /* Keyword.Namespace */
.highlight .kp { color: #007020 } /* Keyword.Pseudo */
.highlight .kr { color: #007020; font-weight: bold } /* Keyword.Reserved */
.highlight .kt { color: #902000 } /* Keyword.Type */
.highlight .m { color: #40A070 } /* Literal.Number */
.highlight .s { color: #4070A0 } /* Literal.String */
.highlight .na { color: #4070A0 } /* Name.Attribute */
.highlight .nb { color: #007020 } /* Name.Builtin */
.highlight .nc { color: #0E84B5; font-weight: bold } /* Name.Class */
.highlight .no { color: #60ADD5 } /* Name.Constant */
.highlight .nd { color: #555; font-weight: bold } /* Name.Decorator */
.highlight .ni { color: #D55537; font-weight: bold } /* Name.Entity */
.highlight .ne { color: #007020 } /* Name.Exception */
.highlight .nf { color: #06287E } /* Name.Function */
.highlight .nl { color: #002070; font-weight: bold } /* Name.Label */
.highlight .nn { color: #0E84B5; font-weight: bold } /* Name.Namespace */
.highlight .nt { color: #062873; font-weight: bold } /* Name.Tag */
.highlight .nv { color: #BB60D5 } /* Name.Variable */
.highlight .ow { color: #007020; font-weight: bold } /* Operator.Word */
.highlight .w { color: #BBB } /* Text.Whitespace */
.highlight .mb { color: #40A070 } /* Literal.Number.Bin */
.highlight .mf { color: #40A070 } /* Literal.Number.Float */
.highlight .mh { color: #40A070 } /* Literal.Number.Hex */
.highlight .mi { color: #40A070 } /* Literal.Number.Integer */
.highlight .mo { color: #40A070 } /* Literal.Number.Oct */
.highlight .sa { color: #4070A0 } /* Literal.String.Affix */
.highlight .sb { color: #4070A0 } /* Literal.String.Backtick */
.highlight .sc { color: #4070A0 } /* Literal.String.Char */
.highlight .dl { color: #4070A0 } /* Literal.String.Delimiter */
.highlight .sd { color: #4070A0; font-style: italic } /* Literal.String.Doc */
.highlight .s2 { color: #4070A0 } /* Literal.String.Double */
.highlight .se { color: #4070A0; font-weight: bold } /* Literal.String.Escape */
.highlight .sh { color: #4070A0 } /* Literal.String.Heredoc */
.highlight .si { color: #70A0D0; font-style: italic } /* Literal.String.Interpol */
.highlight .sx { color: #C65D09 } /* Literal.String.Other */
.highlight .sr { color: #235388 } /* Literal.String.Regex */
.highlight .s1 { color: #4070A0 } /* Literal.String.Single */
.highlight .ss { color: #517918 } /* Literal.String.Symbol */
.highlight .bp { color: #007020 } /* Name.Builtin.Pseudo */
.highlight .fm { color: #06287E } /* Name.Function.Magic */
.highlight .vc { color: #BB60D5 } /* Name.Variable.Class */
.highlight .vg { color: #BB60D5 } /* Name.Variable.Global */
.highlight .vi { color: #BB60D5 } /* Name.Variable.Instance */
.highlight .vm { color: #BB60D5 } /* Name.Variable.Magic */
.highlight .il { color: #40A070 } /* Literal.Number.Integer.Long */