<div class="wrapper">
  <article>
    <h1>Neotoc Playground</h1>
    <p>To learn how to customize the TOC and its styles, read the <a href="https://neotoc.vercel.app" target="_blank">docs</a>. Play around. Enjoy!</p>

    <p>Things you may want to try:</p>

    <ul>
      <li>Add a <code>"dark"</code> class to the <code>&lt;nav&gt;</code> element or any of its parent element to make the TOC appear in dark mode.</li>
      <li>To easily generate randomized dummy content like below you can use the <code>dummy-content</code> CLI from <code>npm</code>. To generate and copy 20 sections of dummy content enter the following in your terminal:
        <pre>
npx dummy-content --format html --sections 20 --copy
</pre>
        Then replace the dummy HTML below with the copied one.
      </li>
      <li>If you want to try out Neotoc with the comfort of your favorite code editor and with some extra features, you can use the <code>create-neotoc</code> CLI to scaffold a Vite powered Neotoc playground. Run the following in your terminal to set it up (you'll need NodeJS installed on your system to run it):
        <pre>
npx create-neotoc
</pre>
    </ul>

    <hr>

    <p>Incididunt ea incididunt ipsum ad laborum qui dolore dolore. Anim veniam irure aute amet magna ut eu exercitation eiusmod commodo. Aliqua enim eiusmod voluptate sunt Lorem. Aliquip cupidatat aute eiusmod. Eiusmod ut culpa esse cupidatat qui et occaecat reprehenderit. Sint ullamco eu minim est velit reprehenderit elit pariatur.</p>
    <h2 id="h-1">1 Adipisicing</h2>
    <p>In velit incididunt sunt amet. Fugiat fugiat ullamco qui duis ea et. Et ullamco ad veniam ipsum irure. Consectetur dolor enim ad duis. Qui quis elit nostrud aliquip adipisicing veniam. Pariatur reprehenderit id cillum. Id esse est quis. Esse laboris qui incididunt.</p>
    <p>Adipisicing pariatur occaecat nulla minim. Consectetur sit eu commodo quis elit elit ea. Laboris cillum fugiat cupidatat ut magna ea anim non. Aute dolor reprehenderit sint reprehenderit commodo aliquip nostrud qui. Dolor fugiat voluptate deserunt consectetur id amet.</p>
    <h3 id="h-1-1">1.1 Laboris occaecat</h3>
    <p>Ea adipisicing incididunt sit dolor eu non deserunt ad. Cillum nisi exercitation excepteur nisi anim nisi id laborum. Amet adipisicing non enim tempor. Minim irure laborum commodo sint. Excepteur mollit excepteur minim tempor proident irure enim nostrud amet Lorem exercitation.</p>
    <p>Laborum dolore veniam ex magna do. Veniam in est non consectetur minim cupidatat nostrud. Ut culpa nostrud laboris dolore ea. Aute commodo tempor laborum excepteur occaecat irure id cillum. Voluptate culpa cupidatat ea aliqua ad laboris ex id in esse eu. Magna ullamco consectetur velit ullamco Lorem excepteur sunt sit eiusmod irure aute.</p>
    <p>Consectetur laboris reprehenderit reprehenderit non occaecat id Lorem occaecat laborum eiusmod. Eiusmod mollit velit mollit elit nulla. Elit nisi sint duis. Tempor dolor esse ea reprehenderit aute quis. Eiusmod quis laborum veniam cillum nisi.</p>
    <h3 id="h-1-2">1.2 Reprehenderit amet</h3>
    <p>Esse mollit ut ad reprehenderit occaecat ullamco cupidatat magna anim. Anim ipsum sit ad minim laborum pariatur sunt. Pariatur dolore consequat quis magna consectetur. Eiusmod ipsum consequat sit excepteur.</p>
    <p>Sint proident pariatur magna. Occaecat et eu ipsum laborum. Magna duis ad laborum. Labore irure sint proident elit. Proident tempor nulla qui elit sunt ea occaecat minim anim.</p>
    <p>Ex in sunt pariatur qui mollit eiusmod voluptate. Cupidatat nulla velit ullamco adipisicing esse eiusmod ex irure dolor aliquip. Elit laboris elit aute minim in culpa amet dolore. Enim sunt amet Lorem ut deserunt. Nulla sunt voluptate est esse ex minim anim ipsum veniam fugiat. Irure sit deserunt et.</p>
    <p>Culpa pariatur non consequat. Et aliqua anim et Lorem minim ea exercitation reprehenderit. Magna est dolor commodo aute anim reprehenderit ad. Fugiat ea eu dolore nulla cupidatat culpa ea. Dolore sunt veniam nostrud officia labore consequat qui consectetur magna esse minim. Magna non ut reprehenderit voluptate. Consequat incididunt non eiusmod labore mollit est nisi.</p>
    <p>Proident exercitation commodo proident ad laboris cillum. Sint ex aliquip consequat aliqua ea sit reprehenderit. Labore Lorem Lorem adipisicing mollit culpa mollit proident culpa commodo laborum. Proident sit labore esse commodo sit incididunt ea sunt occaecat adipisicing.</p>
    <p>Labore anim ea id nulla et. Amet ipsum deserunt in. Ex quis labore dolore. Amet proident veniam sit deserunt adipisicing mollit sunt. Proident pariatur sit commodo duis. Est quis deserunt enim aute sit nisi. Sunt veniam voluptate laborum laboris ea nulla do veniam ex pariatur. Do pariatur dolore tempor nostrud laborum aute amet. Non aliquip veniam nostrud eu reprehenderit aute fugiat est excepteur amet ad. Minim esse consectetur adipisicing.</p>
    <p>Mollit qui occaecat consectetur. Dolor sit reprehenderit anim nostrud aliqua ea. Quis ad veniam proident reprehenderit duis do deserunt eu exercitation aliquip veniam. Id incididunt adipisicing est enim voluptate ex sit nulla deserunt reprehenderit ex. Ullamco aliquip aliqua adipisicing ad laborum voluptate aute aliqua enim.</p>
    <h3 id="h-1-3">1.3 Excepteur excepteur</h3>
    <p>Aliquip deserunt id aute non laborum est in ut nulla pariatur adipisicing. Quis proident adipisicing fugiat. Sunt enim pariatur anim deserunt anim consectetur irure. Dolor nostrud nostrud est cillum cillum eu esse veniam ipsum sit incididunt. Irure enim minim ex veniam. Sint dolor elit commodo reprehenderit. Fugiat adipisicing anim commodo eiusmod sit esse in veniam Lorem consectetur amet. Irure cupidatat cupidatat culpa eu. Culpa esse pariatur ut aliquip aliquip est dolore do.</p>
    <p>Do ipsum Lorem excepteur dolor anim commodo. Ex mollit aliquip nulla commodo Lorem cillum culpa. Exercitation eiusmod tempor qui nostrud sint Lorem exercitation proident consectetur consequat. Est nulla esse irure ea velit reprehenderit. Deserunt veniam amet laborum duis. Pariatur cupidatat cillum pariatur aliqua labore. Ex occaecat laborum labore duis magna velit duis esse exercitation in culpa. Sint non ipsum labore dolore deserunt.</p>
    <h2 id="h-2">2 Do veniam aute dolor</h2>
    <p>Incididunt fugiat ut deserunt ut. Laborum dolor consectetur aute voluptate amet reprehenderit occaecat culpa eu. Ex sit Lorem nostrud. Labore cillum culpa aliqua qui eiusmod commodo officia labore. Sint aute enim esse minim. Mollit ex elit est dolore incididunt cillum minim.</p>
    <p>Deserunt occaecat fugiat eu occaecat do consectetur irure irure nisi id duis. Proident cillum consectetur dolore fugiat excepteur dolore occaecat nulla est culpa ipsum. Adipisicing ut voluptate consequat anim Lorem sit nostrud sit labore nostrud sint. Irure amet enim adipisicing exercitation consectetur amet nostrud sit. Deserunt ad ut velit sit. Nisi magna deserunt do ullamco aute dolore proident tempor officia.</p>
    <h2 id="h-3">3 Commodo</h2>
    <p>Eiusmod proident ea esse enim enim reprehenderit laboris aute voluptate. Nostrud minim consequat esse eiusmod aliqua. Id ea laboris nisi cillum ex et dolore laboris pariatur laboris. Veniam nostrud excepteur commodo commodo et labore incididunt sint deserunt excepteur veniam. Lorem eiusmod consequat dolore velit magna cillum magna.</p>
    <p>Enim officia sint nulla duis aliquip anim sit enim magna deserunt. Magna laborum duis esse est duis ullamco pariatur nulla aliquip. Do est ipsum sunt esse. Commodo id Lorem commodo consectetur voluptate excepteur cillum occaecat aliquip culpa. Non dolore ut cillum nostrud aliquip aliquip aute. Enim anim magna pariatur ad esse.</p>
    <p>Elit adipisicing velit labore ullamco pariatur consequat aliqua id dolore. Et labore laboris voluptate enim exercitation ex. Quis velit sit incididunt reprehenderit irure pariatur ut tempor consequat deserunt. Sit officia commodo incididunt id anim sunt. Nisi ex et tempor dolor magna labore Lorem magna aute. Id nisi aliquip incididunt laboris id anim fugiat. Officia culpa quis fugiat esse labore est.</p>
    <p>Ex irure elit sunt labore adipisicing proident sit quis eiusmod exercitation. Est veniam quis amet. Culpa ea consequat et. Nulla commodo minim aliqua voluptate esse Lorem minim aliquip duis irure. Ad adipisicing ex dolore amet. Labore aute commodo veniam. Nostrud proident ad consectetur proident mollit.</p>
    <h2 id="h-4">4 Dolor culpa laboris est non</h2>
    <p>Excepteur ex duis excepteur commodo sit dolor irure adipisicing ipsum eiusmod. Enim laborum sunt dolor aliqua anim aute ex tempor ad. Cillum sunt amet nisi mollit ad do do dolore. Tempor reprehenderit culpa aute proident cupidatat. Duis laboris pariatur non in Lorem. Officia velit nulla aliquip ut. Est in ad exercitation ea do. Deserunt exercitation in proident. Mollit esse est commodo cillum dolore incididunt cupidatat sint mollit tempor. Cillum laboris id reprehenderit.</p>
    <p>Ipsum ut eiusmod eu deserunt ullamco pariatur proident. Pariatur ut ullamco amet. Do exercitation ipsum dolor dolor ut. Dolor nulla irure exercitation in.</p>
    <p>Aute laboris ex ut laboris exercitation fugiat dolor consequat consequat. Duis sit ex laboris laborum cupidatat excepteur. Dolor non exercitation id id minim tempor exercitation eu in eiusmod qui. Sint labore et velit cillum pariatur. Culpa esse dolore mollit enim amet dolor exercitation adipisicing.</p>
    <p>Tempor sint quis id ut exercitation mollit laborum. Nulla do do mollit consectetur veniam qui velit ea dolore ex. Enim adipisicing in id aute et occaecat qui voluptate magna pariatur voluptate. Do id est et cupidatat in culpa esse velit nulla velit. Ad ea non aute pariatur. Amet nulla minim amet sunt nostrud ea elit velit laborum aliquip. Est fugiat exercitation aute consectetur occaecat nulla amet excepteur commodo pariatur.</p>
    <h2 id="h-5">5 Officia aute velit ad</h2>
    <p>Consequat in esse duis dolore ullamco excepteur ipsum. Nostrud anim laborum ea reprehenderit. Reprehenderit esse ea ea fugiat ullamco sint magna officia. Nisi fugiat consequat occaecat proident magna voluptate et ad cupidatat consectetur velit. Nostrud proident exercitation nisi ullamco dolore fugiat consequat occaecat aute in.</p>
    <p>Nisi amet enim occaecat anim dolor laborum nisi. Minim irure sunt labore voluptate qui. Aliqua veniam laboris dolor ullamco quis proident non id ad laboris ullamco. Tempor nostrud quis voluptate velit in reprehenderit ad velit.</p>
    <p>Cupidatat irure incididunt consequat ea dolore sit anim incididunt proident aute excepteur. Elit incididunt culpa id ipsum eiusmod ad esse in sunt ad elit. Voluptate sint commodo anim minim laborum ipsum. Nisi consequat enim aute minim. Amet laborum occaecat voluptate mollit pariatur exercitation nisi officia aute in. Laboris eiusmod nisi laborum incididunt esse reprehenderit ipsum deserunt.</p>
    <p>Aliqua eu eu culpa dolor velit aute voluptate. Mollit occaecat minim labore sint Lorem ut. Nisi ea mollit voluptate ut excepteur ad. Commodo nisi qui adipisicing. Consectetur dolore minim tempor veniam ea ea. Non Lorem id sint. Labore et id veniam amet. Eu nisi et non ut amet ea irure consectetur eiusmod culpa. Sint veniam esse cupidatat. Velit voluptate quis aute tempor non elit sit labore.</p>
    <p>Veniam aliqua qui esse incididunt fugiat fugiat occaecat. Deserunt exercitation ad aliqua sint consectetur anim cupidatat esse do reprehenderit. Lorem magna commodo proident. Consequat velit veniam ullamco veniam consequat elit nostrud nisi ut. Laboris incididunt exercitation voluptate laboris voluptate ad nulla esse esse eu dolor. Elit ullamco consequat fugiat ad velit id ut. Commodo nulla proident pariatur cupidatat sit magna ex amet reprehenderit. Reprehenderit labore reprehenderit commodo dolore mollit amet veniam.</p>
    <p>Consectetur pariatur non amet aliquip aliqua nisi sit. Ullamco nisi duis magna. Voluptate consectetur nostrud culpa consectetur ipsum excepteur occaecat nostrud est non. Lorem nulla mollit quis deserunt consectetur reprehenderit veniam ad reprehenderit adipisicing. Ut esse tempor voluptate esse excepteur enim laboris pariatur. Aute tempor quis eiusmod.</p>
    <p>Excepteur ea officia amet incididunt pariatur Lorem. Officia in in incididunt proident eu commodo aliqua pariatur. Sint nostrud commodo sint elit laboris irure nostrud consequat incididunt. Ipsum proident culpa veniam sit.</p>
    <p>Do ullamco aute sit cillum dolor exercitation anim magna voluptate incididunt et. Amet enim fugiat Lorem tempor. Labore non ut eu. Culpa minim nostrud laboris reprehenderit cupidatat labore ipsum consequat proident non.</p>
    <h2 id="h-6">6 Sint</h2>
    <p>Nulla anim anim tempor veniam. Id qui laborum eu in cillum minim. Ad labore eu laborum. Dolore duis quis id. Ipsum ea do veniam culpa Lorem mollit deserunt deserunt cillum consectetur. Qui nisi irure eu. Velit est Lorem et Lorem. Elit qui ex anim eiusmod Lorem eiusmod. Incididunt cillum ad ea sint ex adipisicing reprehenderit.</p>
    <p>Officia aute mollit consequat aliqua consectetur irure mollit nulla consectetur. Cupidatat cillum deserunt labore laborum dolore incididunt proident. Deserunt incididunt ex reprehenderit in proident qui elit ad. Id incididunt voluptate consectetur quis nulla eiusmod adipisicing nisi tempor. Aliquip in labore id ut ullamco reprehenderit laborum proident excepteur. Incididunt reprehenderit veniam esse nulla cillum anim.</p>
    <h3 id="h-6-1">6.1 Voluptate</h3>
    <h4 id="h-6-1-1">6.1.1 Do deserunt qui</h4>
    <h5 id="h-6-1-1-1">6.1.1.1 Sit sint laborum</h5>
    <p>Eiusmod minim ipsum nisi veniam ipsum qui minim mollit culpa Lorem. Et nulla nostrud elit nulla proident sunt sit. In Lorem reprehenderit consequat commodo aliquip ut velit consectetur. Nostrud culpa mollit pariatur exercitation amet pariatur. Eiusmod voluptate pariatur esse quis laborum consectetur. Nostrud quis deserunt Lorem aute exercitation. Eu adipisicing reprehenderit est ullamco nulla. Quis consequat eiusmod amet nostrud officia quis amet non exercitation. Adipisicing eu ex laboris voluptate. Occaecat deserunt voluptate do excepteur est anim eiusmod dolore.</p>
    <h3 id="h-6-2">6.2 Nostrud ad</h3>
    <p>Aliquip consectetur cupidatat elit commodo. Labore cillum esse aliquip esse. Dolore ea incididunt reprehenderit laborum nisi enim ipsum ipsum in qui. Nulla commodo sunt voluptate. Excepteur cillum reprehenderit tempor occaecat eiusmod ut velit qui occaecat ipsum nulla. Laborum labore tempor officia sit nostrud eu. Enim occaecat culpa veniam qui eiusmod ea. Amet nulla est amet. Deserunt dolor occaecat sunt ut elit do quis ea in sit.</p>
    <p>Sit nulla fugiat reprehenderit enim dolor aute incididunt do irure officia excepteur. Pariatur dolore cillum commodo eu. Non veniam sit aute exercitation proident. Labore dolor cupidatat dolor enim officia. Incididunt ex ex sunt. Anim mollit ex culpa. Magna magna occaecat amet enim dolor dolore consequat aliqua commodo irure. Exercitation id deserunt ad esse nostrud elit ea ea minim aliqua. Reprehenderit minim irure nostrud non voluptate dolor Lorem reprehenderit adipisicing. Ad mollit voluptate ullamco adipisicing incididunt esse commodo nostrud ea aute.</p>
    <p>Mollit veniam cupidatat mollit fugiat minim culpa do. Ullamco aute mollit voluptate culpa sint enim minim eiusmod magna. Incididunt adipisicing culpa ad tempor. Irure duis ad exercitation cillum. Deserunt reprehenderit commodo aliquip laborum aliqua sunt. Laboris consequat quis aute consectetur ullamco labore aute sunt nisi qui nulla. Ex dolore mollit tempor anim laboris fugiat. Fugiat nulla deserunt minim.</p>
    <p>Amet consectetur voluptate incididunt. Reprehenderit amet ad occaecat id cupidatat proident ullamco. Non duis cillum labore magna. Eu sunt esse irure cupidatat ipsum ad enim cillum incididunt aute. Excepteur dolore mollit ipsum enim dolore elit ea. Officia velit velit elit duis officia. Ad culpa duis eu do est magna velit et excepteur labore. Anim id duis ipsum incididunt in ullamco. Ex do Lorem nostrud quis ea. Aute labore ut tempor occaecat pariatur incididunt cillum aute dolore magna.</p>
    <p>Voluptate tempor commodo culpa. Qui Lorem laborum ad non dolore. Occaecat duis exercitation magna laborum aliquip. Ad in irure exercitation excepteur minim incididunt sit officia mollit eu adipisicing. Cillum do irure esse laborum aute duis. Proident est minim commodo est consectetur dolore. Qui aliquip mollit proident non ut laborum est excepteur qui veniam.</p>
    <p>Nostrud ea excepteur enim nisi ad laboris sunt sit. Enim cillum fugiat quis in incididunt id excepteur. Incididunt proident quis non adipisicing excepteur anim et velit elit elit. Incididunt aliquip laborum occaecat qui qui excepteur voluptate eu minim eiusmod. Qui officia duis duis velit deserunt minim id cillum velit fugiat. Eu duis in ex in.</p>
    <p>Tempor commodo sunt culpa laboris laborum occaecat mollit in exercitation dolore. Nostrud amet pariatur deserunt culpa elit sit. Pariatur cillum amet est do cupidatat et consectetur aute incididunt voluptate. Elit ex nulla nostrud officia cillum. Id nostrud voluptate ut quis ad consectetur amet eiusmod veniam. Nulla consequat nulla aliqua id veniam laborum consequat incididunt commodo aliqua. Aliqua adipisicing ex commodo occaecat. Dolore Lorem dolor elit Lorem non. Eiusmod qui id excepteur. Nulla aliquip enim minim irure ad in ullamco.</p>
    <h3 id="h-6-3">6.3 Veniam laborum nulla cupidatat officia</h3>
    <p>Quis amet qui esse ad anim do non elit. Ea ullamco eiusmod tempor qui ex exercitation ut. Nisi amet tempor qui magna consectetur quis commodo reprehenderit. Nostrud excepteur consequat est exercitation anim minim sint adipisicing. Cillum pariatur adipisicing nulla elit eiusmod.</p>
    <p>Consectetur enim labore excepteur fugiat culpa voluptate laboris. Id irure do tempor esse ullamco Lorem anim eu. Aliquip tempor enim non aliqua ullamco sunt velit dolore amet fugiat. Esse excepteur sint aliqua duis. Aliquip id veniam velit officia duis amet eu anim aliqua ut. Consectetur sit minim mollit incididunt aliqua.</p>
    <p>Minim nostrud commodo pariatur nostrud occaecat ex id proident esse laboris qui. Anim sunt do dolor. Veniam laboris fugiat amet duis id. Consequat tempor consectetur esse laborum incididunt culpa occaecat. Nostrud qui ex est pariatur sit sint culpa occaecat eu id pariatur. Non sunt consequat minim minim esse ut elit sit. Commodo adipisicing tempor dolore ea qui est eu tempor. Mollit ipsum non irure eu consectetur. Deserunt proident veniam voluptate nisi ullamco pariatur qui adipisicing ea officia occaecat. Ex laboris nostrud velit sunt ea est.</p>
    <p>Aliquip aliquip ad laborum ad cillum consequat exercitation aliquip velit. Labore incididunt mollit in sit officia ut mollit pariatur eu eiusmod. Irure voluptate mollit qui. Do laboris pariatur ullamco elit qui et ex veniam. Dolore id in reprehenderit Lorem qui laboris ullamco eu ad magna velit. Voluptate dolor cupidatat sit nisi ad magna esse ad commodo voluptate id. Consequat eiusmod et officia ad laborum.</p>
    <p>Nulla do Lorem Lorem voluptate eu magna tempor mollit enim. Dolore in est nisi id qui esse irure ea. Non qui laboris voluptate excepteur dolor. Lorem cupidatat amet occaecat fugiat in. Do ea laboris est ullamco labore ut nisi. Cillum fugiat laborum do esse eu eiusmod ipsum.</p>
    <p>Minim elit enim fugiat fugiat anim enim nostrud ut voluptate sit. Cillum commodo laborum laborum cupidatat anim. Ea magna nulla aliqua duis exercitation incididunt ipsum dolore. Lorem enim enim mollit nisi Lorem adipisicing sit Lorem reprehenderit labore ipsum. Id velit magna exercitation ea non adipisicing minim et adipisicing sint culpa. Officia incididunt in ad deserunt aliquip laborum.</p>
    <p>Consequat exercitation proident veniam pariatur voluptate reprehenderit amet. Tempor magna nisi dolore minim tempor tempor minim voluptate laboris fugiat nisi. Id veniam irure non. Sit anim sint cupidatat reprehenderit cillum sint sint consequat proident reprehenderit sunt.</p>
    <h3 id="h-6-4">6.4 Aliquip</h3>
    <p>Eu nisi est id culpa in voluptate sunt aliquip. Enim officia mollit enim excepteur. Enim sunt exercitation sint in nostrud et fugiat elit enim eu ad. Nostrud nulla non do deserunt duis laborum laboris aliqua nostrud. Id sit aute excepteur enim non eu mollit do. Amet id qui Lorem. Consequat exercitation est consectetur irure enim quis do adipisicing mollit qui.</p>
    <p>Anim ea voluptate qui laboris proident duis elit. Eiusmod commodo ex amet et aute aliqua consequat aute do esse et. Et mollit et magna. Sit Lorem commodo ipsum commodo ipsum laborum minim excepteur sint. Laboris commodo ipsum magna ad amet consequat laboris do. Excepteur ea est aliquip consectetur consequat culpa.</p>
    <p>Eiusmod eiusmod proident Lorem incididunt occaecat sint laborum occaecat eiusmod proident. Velit do deserunt aliquip officia nisi labore. Ex anim nisi pariatur aliqua. Sunt qui esse minim anim cupidatat. Reprehenderit sint occaecat nulla minim dolor ea aute occaecat et do.</p>
    <p>Ea elit aliqua pariatur exercitation non officia deserunt. Quis officia anim ut ex duis. Occaecat sint nulla enim ullamco. Tempor ad ullamco tempor veniam. Pariatur voluptate non adipisicing esse aliqua. Ex reprehenderit deserunt mollit minim commodo minim enim irure est. Dolore quis id enim mollit nulla minim. Aliquip irure ullamco minim minim fugiat dolor mollit ex velit.</p>
    <p>Fugiat laborum laborum enim mollit ea. Duis duis sit fugiat occaecat dolore sit sint. Et enim mollit commodo. Aliqua aliqua minim ipsum ea deserunt nulla amet et dolor sunt culpa. Laborum pariatur commodo enim sit magna minim. Incididunt laboris ea nostrud. Laborum cillum reprehenderit veniam consectetur occaecat ea mollit sit. Et culpa sit laboris anim officia cupidatat esse do.</p>
    <p>Nisi adipisicing cupidatat esse proident ex in aliqua. Deserunt reprehenderit laborum aliqua fugiat consectetur esse incididunt minim cupidatat proident eu. Consectetur adipisicing occaecat ex occaecat. Irure minim do veniam ipsum est cillum proident. In ipsum dolore incididunt non. Pariatur commodo duis adipisicing sit minim nostrud ad culpa eiusmod irure. Laborum et ex nisi. Reprehenderit deserunt aliquip sit cupidatat mollit.</p>
    <h3 id="h-6-5">6.5 Eu dolore aute</h3>
    <p>Eu id velit nisi est nostrud amet magna cillum reprehenderit. In eiusmod in aliquip nostrud ad consequat incididunt culpa ipsum ex. Velit elit deserunt proident. Lorem sit aliqua nisi tempor deserunt sit deserunt incididunt eiusmod est. Fugiat anim adipisicing adipisicing labore fugiat anim elit ipsum incididunt. Sit nisi cupidatat minim aliqua eu nostrud ipsum.</p>
    <p>Ad officia magna ipsum. Mollit commodo adipisicing labore ad. Ullamco irure est excepteur quis elit incididunt consequat enim. Sunt adipisicing ipsum fugiat labore ullamco ex nostrud deserunt amet laborum cillum. Ullamco esse aliqua deserunt nisi aliquip fugiat.</p>
    <p>Nulla elit culpa sit laboris ea est adipisicing duis ut enim. Et est esse ad sint commodo commodo officia officia consequat. Ipsum enim non non magna. Consequat sint elit duis dolor nostrud amet. Eiusmod qui tempor laborum ipsum minim minim minim.</p>
    <h4 id="h-6-5-1">6.5.1 Tempor qui</h4>
    <p>Adipisicing duis sunt sit eu tempor nulla laborum. Proident occaecat nostrud voluptate exercitation eu. Duis irure quis irure est labore ex minim eu deserunt fugiat. Mollit ea laboris dolore sit cupidatat mollit dolor tempor sunt cillum. Sit non est ut id ut cillum est ipsum ut ad eiusmod. Consectetur laborum ea dolor irure ea culpa irure cillum. Sit dolore eu elit culpa excepteur officia cupidatat ad eu laboris ea. Consequat laborum ipsum ad ad occaecat duis veniam id nisi exercitation sunt. Nulla esse ipsum duis non tempor. Voluptate commodo nostrud in ex ad.</p>
    <p>Occaecat quis irure nulla sint. Anim cillum ullamco ea quis commodo sint culpa. Sint velit esse sunt laborum in et ad adipisicing voluptate. Qui proident id consequat non.</p>
    <p>Dolore esse laboris labore. Mollit voluptate ad in dolore tempor do. Ipsum fugiat eiusmod velit exercitation culpa dolore sit laboris sunt. Tempor irure est ut exercitation duis laborum consectetur laborum proident. Ad fugiat incididunt eiusmod ea duis ea amet ut proident laborum. Sint voluptate laboris commodo non velit qui Lorem ad anim dolor.</p>
    <p>Consequat cillum velit consequat dolor amet. Nisi pariatur tempor do deserunt magna. Dolor voluptate cillum ex. Quis incididunt irure nisi dolore nisi duis nisi.</p>
    <p>Fugiat do sint Lorem aliqua. Cillum do sint magna aute enim reprehenderit in adipisicing ex pariatur pariatur. Dolor ullamco Lorem labore dolor velit id aute ullamco aute exercitation incididunt. Reprehenderit commodo excepteur laborum minim proident exercitation culpa culpa veniam. In laboris nulla velit dolor aliqua. Quis anim nostrud excepteur enim laborum.</p>
    <p>Duis ea ullamco consequat. Pariatur eu elit velit magna amet exercitation fugiat ad. Est non eu est aute veniam amet incididunt quis deserunt. Dolor labore nulla amet ullamco esse adipisicing occaecat irure. Ullamco aliquip laboris est fugiat consectetur proident. Consequat veniam irure adipisicing anim aute cillum.</p>
    <p>Nostrud enim nisi est commodo culpa ullamco elit aliqua. Ex nisi adipisicing excepteur enim officia sint occaecat laborum dolor consectetur. Amet voluptate voluptate eiusmod veniam proident incididunt culpa. Et laboris exercitation quis veniam non esse non amet. Commodo enim ea eiusmod ullamco ipsum aliquip. Mollit do tempor officia Lorem eiusmod ut excepteur mollit velit nulla qui. Qui velit veniam adipisicing Lorem in incididunt. Adipisicing pariatur do ut culpa ipsum aliqua cillum laboris veniam fugiat.</p>
    <p>Lorem cupidatat velit Lorem sit in nulla. Enim voluptate laboris deserunt. Mollit deserunt ea enim consectetur sit dolore dolore anim. In Lorem tempor elit veniam do.</p>
    <h5 id="h-6-5-1-1">6.5.1.1 Officia reprehenderit velit</h5>
    <p>Ex cillum fugiat occaecat in magna aliquip mollit excepteur. Fugiat duis consequat officia magna est fugiat est deserunt sint et non. Id Lorem voluptate voluptate commodo sit Lorem reprehenderit do ea proident. Ipsum laborum qui pariatur ullamco ullamco sunt non. Deserunt elit magna minim ut adipisicing sit consectetur ut nulla esse nisi. Consequat sint eiusmod pariatur esse.</p>
    <p>Veniam et aliqua esse. Irure ullamco minim exercitation. Do officia reprehenderit ipsum ad in occaecat ad quis. Irure voluptate esse nulla eiusmod incididunt ut ut. Aliqua sint id eiusmod fugiat ut pariatur ex sit ad. Ex cupidatat esse excepteur aliqua consequat fugiat quis nulla. Nisi proident ipsum eiusmod sit sint eiusmod. Nulla exercitation nostrud sint cillum pariatur ut deserunt ullamco excepteur. Et eiusmod aute consectetur laboris cillum exercitation. Lorem incididunt aliqua duis ut nostrud fugiat pariatur culpa labore consequat est.</p>
    <p>Consequat id amet labore duis quis laborum anim tempor sint culpa. Ut sit pariatur incididunt ullamco proident nostrud ex sunt id. Voluptate quis id consequat consectetur. Minim eiusmod duis minim dolor commodo sunt id. Incididunt nulla fugiat proident consequat aliquip commodo et eu laborum eiusmod Lorem. Reprehenderit exercitation cupidatat proident ullamco duis dolore proident commodo deserunt qui. Lorem qui eu laboris eu consequat Lorem in.</p>
    <p>Magna consectetur labore ullamco ullamco adipisicing exercitation. Nulla exercitation reprehenderit et voluptate. Sunt fugiat non fugiat aliquip ex et nostrud Lorem exercitation aute. Pariatur adipisicing nisi excepteur sunt laborum. Ad consectetur proident ut.</p>
    <p>Adipisicing deserunt eu qui incididunt et pariatur esse. Minim aliquip qui consectetur dolor ullamco dolor ullamco. Ullamco aliqua nisi magna aute enim quis ullamco sit mollit duis incididunt. Ea excepteur sit laboris tempor ipsum. Velit elit est elit consequat sunt cupidatat ipsum tempor do irure aute. Laborum id deserunt excepteur quis aliqua mollit exercitation in eiusmod consectetur. Dolore elit sit commodo non enim anim tempor sunt voluptate deserunt do.</p>
    <p>Incididunt dolor ullamco ipsum sunt nostrud deserunt dolore pariatur eu. Aliquip duis culpa ex. Ex eu amet est exercitation consequat ullamco qui est. Dolor consectetur cupidatat labore. Excepteur consectetur elit anim officia fugiat excepteur labore sit deserunt eu. Qui adipisicing nisi quis consectetur ipsum id. Aliquip voluptate in nisi nisi cillum sit do eiusmod. Qui in non sint.</p>
    <p>Voluptate ut proident qui velit irure. Non exercitation officia ad. Reprehenderit commodo velit deserunt mollit aliqua et voluptate duis et Lorem voluptate. Fugiat Lorem ut ex fugiat elit nostrud. Consequat labore culpa veniam irure consectetur.</p>
    <p>Est officia velit minim sit irure cupidatat non tempor deserunt minim. Labore velit Lorem aliquip laboris Lorem labore aliquip ad. Voluptate occaecat commodo aliqua occaecat labore duis est adipisicing laboris duis consequat. Nostrud aliqua sit nisi id commodo nisi non.</p>
    <h3 id="h-6-6">6.6 Quis</h3>
    <p>Pariatur velit tempor sunt. Quis deserunt dolore qui ut laboris minim irure cillum tempor labore consectetur. Commodo consequat nulla officia nisi voluptate do officia ullamco incididunt anim. Elit laborum consectetur culpa cillum commodo et fugiat cillum voluptate. Voluptate consectetur ipsum ullamco eiusmod. Commodo veniam quis aliqua sunt eiusmod excepteur consequat ea adipisicing nostrud. Irure aliqua consectetur sint enim eu amet minim do. Occaecat et commodo officia fugiat magna.</p>
    <p>Dolore occaecat consequat occaecat eiusmod laboris esse enim reprehenderit. Commodo sint duis eu sunt voluptate amet ex est. Nisi tempor officia aliquip do enim in. Dolore nostrud est tempor duis officia velit duis dolor. Esse eiusmod ad ex ad ullamco. Est sint ipsum ipsum.</p>
    <p>Consequat ullamco fugiat voluptate pariatur incididunt anim. Sit commodo ad voluptate reprehenderit nisi est adipisicing ad in. Labore elit elit aliqua amet eiusmod excepteur culpa nostrud. Id magna ipsum culpa qui. Do proident proident aute nulla.</p>
    <p>Duis irure sit tempor non incididunt exercitation sunt non veniam. Deserunt aliqua eiusmod velit aliqua adipisicing id amet officia laboris est eiusmod. Cillum commodo sint tempor. Nisi id officia sit quis. Velit mollit voluptate quis laborum ad sit. Esse magna aliquip aute commodo occaecat.</p>
    <p>Consequat officia nisi in culpa officia sint ut in nostrud irure. Dolore irure veniam ad. Esse aute proident magna labore proident velit quis et magna ipsum. Id do sunt voluptate nisi id. Sunt laboris labore laboris non dolor minim commodo ullamco. Veniam proident ex incididunt nostrud aliquip. Consequat sint aliquip nostrud enim duis occaecat elit sint velit reprehenderit minim. Enim minim laboris do labore duis consectetur voluptate.</p>
    <p>Pariatur eiusmod elit est ipsum esse non sint est. Consectetur qui fugiat aute qui. Reprehenderit ut ullamco cupidatat ullamco et et culpa quis tempor laboris officia. Lorem aute fugiat excepteur quis. Enim incididunt labore ut adipisicing cillum consectetur fugiat nisi elit sunt consectetur. Tempor tempor mollit Lorem nisi.</p>
    <p>Consectetur incididunt eu do labore commodo mollit ad eiusmod anim eiusmod. Duis duis aute laborum adipisicing nulla commodo consequat adipisicing laborum. Consectetur officia dolore reprehenderit est velit occaecat. Aute officia non amet. Mollit enim sunt enim ipsum. Incididunt sunt do ad nulla qui nostrud cupidatat laboris eiusmod. Magna occaecat eu do aute aliquip consectetur.</p>
    <p>Reprehenderit commodo esse incididunt ad mollit ullamco reprehenderit. Laboris duis labore enim do veniam consectetur eiusmod excepteur deserunt eu. Anim incididunt ex amet sunt incididunt incididunt deserunt velit duis. Ex velit elit ex occaecat. Ut Lorem tempor aute dolore eu magna ea amet culpa. Ex ipsum nulla cillum laboris anim anim excepteur cupidatat veniam tempor.</p>
    <h3 id="h-6-7">6.7 Velit Lorem dolore ad</h3>
    <p>Excepteur qui dolor dolore sint velit. Incididunt enim laborum non sint consectetur aliqua duis. Ipsum Lorem ipsum aliqua exercitation culpa sit est. Labore sit mollit ut. Proident eiusmod adipisicing dolore excepteur fugiat.</p>
  </article>
  <nav></nav>
</div>

:root {
  scroll-behavior: smooth;
  scroll-padding-top: 1rem;
  font-family: system-ui, sans-serif;
}

.wrapper {
  display: grid;
  grid-template-columns: 1fr minmax(0, 596px) 20px 320px 1fr;
}

article {
  padding-inline: 0.5rem;
  grid-column-start: 2;
}

nav {
  position: relative;
  grid-column-start: 4;
}

@media (max-width: 767px) {
  .wrapper {
    grid-template-columns: 1fr;
  }

  article {
    grid-column-start: 1;
  }

  nav {
    position: fixed;
    width: 70vw;
    top: 0;
    right: 0;
  }
}

.nt-widget {
  --body-height: calc(100vh - 8rem);
  position: sticky;
  top: 2rem;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-bottom-left-radius: 10px;
  overflow: hidden;
  font-size: 0.85em;
  
  /* This class is applied to the building blocks of indent lines */
  .nt-indent-block {
    transition: opacity 0.15s;
    opacity: 0;
  }
}

.nt-widget:hover .nt-indent-block {
  opacity: 1;
}

@media (max-width: 767px) {
  .nt-widget {
    --body-height: calc(50vh);
    border: 1px solid gray;
    border-radius: 0;
    border-top: none;
    border-right: none;
    border-bottom-left-radius: 10px;
  }
}

import neotoc from "https://esm.sh/neotoc";

neotoc({ 
  io: 'article >> h2,h3,h4,h5,h6 >> nav',
  offsetTop: 16
});