pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
  Theme: GitHub
  Description: Light theme as seen on github.com
  Author: github.com
  Maintainer: @Hirse
  Updated: 2021-05-15

  Outdated base version: https://github.com/primer/github-syntax-light
  Current colors taken from GitHub's CSS
*/.hljs{color:#24292e;background:#fff}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#d73a49}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#6f42c1}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-variable,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id{color:#005cc5}.hljs-regexp,.hljs-string,.hljs-meta .hljs-string{color:#032f62}.hljs-built_in,.hljs-symbol{color:#e36209}.hljs-comment,.hljs-code,.hljs-formula{color:#6a737d}.hljs-name,.hljs-quote,.hljs-selector-tag,.hljs-selector-pseudo{color:#22863a}.hljs-subst{color:#24292e}.hljs-section{color:#005cc5;font-weight:700}.hljs-bullet{color:#735c0f}.hljs-emphasis{color:#24292e;font-style:italic}.hljs-strong{color:#24292e;font-weight:700}.hljs-addition{color:#22863a;background-color:#f0fff4}.hljs-deletion{color:#b31d28;background-color:#ffeef0}:root{--accent: #d63a3a;--text: #1a1a1a;--muted: #666;--border: #e2e2e2;--bg: #ffffff;--code-bg: #f5f5f5;--font-sans: "Inter", system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, monospace}*,*:before,*:after{box-sizing:border-box}body{margin:0;color:var(--text);background:var(--bg);font-family:var(--font-sans);line-height:1.75}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}strong{font-weight:600}code{background:var(--code-bg);padding:2px 5px;border-radius:4px;font-family:var(--font-mono);font-size:.82em;border:1px solid var(--border)}pre{background:var(--code-bg);border:1px solid var(--border);border-radius:8px;overflow-x:auto;margin:8px 0 20px}pre code{border:none;padding:16px 20px;background:transparent;font-size:inherit;display:block}pre code.hljs{background:transparent!important;font-family:var(--font-mono)!important;font-size:.82em;padding:16px 20px}table{border-collapse:collapse;width:100%;margin:8px 0 20px;font-size:.9em}th,td{border:1px solid var(--border);padding:8px 12px;vertical-align:top;text-align:left}th{background:var(--code-bg);font-weight:600;white-space:nowrap}hr{border:none;border-top:1.5px solid var(--border);margin:48px 0}@font-face{font-family:Apfel Grotezk;src:url(../fonts/ApfelGrotezk-Regular.woff) format("woff"),url(../fonts/ApfelGrotezk-Regular.ttf) format("truetype");font-weight:300;font-style:normal}@font-face{font-family:Apfel Grotezk;src:url(../fonts/ApfelGrotezk-Mittel.woff) format("woff"),url(../fonts/ApfelGrotezk-Mittel.ttf) format("truetype");font-weight:500;font-style:normal}html,body{max-width:100%;overflow-x:hidden}body{font-size:1.25rem;margin:0;padding:0;background:#fff;font-family:Apfel Grotezk;font-weight:300;line-height:1.45}.title-section{width:100%;padding:1rem 1.25rem 1.5rem;margin:0;background:orange;border-bottom:1px solid #000}.title-section h1{margin:0}.content{max-width:53.75rem;margin:0 auto;padding:0 1.25rem 5rem;width:100%;box-sizing:border-box}a{text-decoration:underline;overflow-wrap:anywhere}img,video{max-width:100%;height:auto}h1{width:100%;font-size:clamp(2rem,7.2vw,5.5rem);font-weight:700;line-height:1;font-family:Apfel Grotezk,sans-serif;letter-spacing:-.02em}.content h1{margin-top:2.5rem}h2{margin-top:2.5rem;font-size:1.5em;font-weight:600;font-family:Apfel Grotezk,sans-serif}h3{margin-top:1.25rem;font-weight:600}p,li{margin-bottom:.375rem;text-wrap:pretty;line-height:1.45}ul,ol{padding-left:1.25rem;margin-bottom:.75rem}.diagram{margin:1rem 0 1.5rem;padding:.6rem;border:2px solid #000;border-radius:.85rem;background:#fffef9}.diagram-label{margin:0 0 .35rem;font-size:.74em;font-family:Apfel Grotezk,sans-serif;font-weight:500;letter-spacing:.02em;text-transform:uppercase}.diagram img{display:block;width:100%;height:auto;border:none;border-radius:.5rem}.diagram figcaption{margin-top:.45rem;font-size:.82em;font-family:Apfel Grotezk,sans-serif;font-weight:500}.diagram figcaption:before{content:"→ "}.content table{width:100%;margin:1rem 0 1.5rem;border-collapse:separate;border-spacing:0;border:2px solid #000;border-radius:.85rem;overflow:hidden;background:#fffef9;font-size:.95em}.content th,.content td{border-right:1px solid #000;border-bottom:1px solid #000;padding:.55rem .7rem;vertical-align:top}.content th{background:#ffe7b8;font-weight:600}.content tr>:last-child{border-right:none}.content tbody tr:last-child>*{border-bottom:none}.content tbody tr:nth-child(2n) td{background:#fffaf0}.code-block{margin:1rem 0 1.5rem;overflow:hidden;background:#fff}.code-block-header{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.45rem .65rem;background:orange;font-family:Apfel Grotezk,sans-serif;font-weight:500}.code-block-language{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em}.code-block-copy{border:1px solid black;background:#fff;color:#000;border-radius:999px;padding:.2rem .6rem;font:inherit;font-size:.75rem;cursor:pointer;transition:background .15s ease,color .15s ease,transform .15s ease}.code-block-copy:hover{background:#000;color:#fff}.code-block-copy:active{transform:scale(.97)}.code-block-copy:focus-visible{outline:2px solid black;outline-offset:2px}.code-block-copy.is-copied{background:#000;color:#fff}.code-block-copy.is-copy-manual{background:#fff8e1}.code-block pre{margin:0;border:none;border-radius:0;background:#fffef9;overflow-x:auto;-webkit-overflow-scrolling:touch}.code-block pre code,.code-block pre code.hljs{padding:.9rem 1rem}.step{margin:1rem 0 1.5rem;position:relative;padding:1rem 1rem 1rem 2.75rem;border-radius:1rem;background:#fff6dc}.step:before{content:attr(data-step-label);position:absolute;top:-.65rem;left:0rem;width:2.2rem;height:2.2rem;display:grid;place-items:center;border-radius:50%;background:orange;border:2px solid #000;font-family:Apfel Grotezk,sans-serif;font-weight:700;font-size:.95rem;line-height:1;transform:rotate(-12deg);box-shadow:.1rem .12rem #00000026}.step-num{font-weight:600;font-size:.85em;margin-bottom:.375rem}.step>:first-child{margin-top:0}.step>:last-child{margin-bottom:0}.try{margin:1rem auto;padding:1.2rem 0rem 1.25rem}.try:before{content:"Try it yourself!";display:block;width:fit-content;font-weight:600;font-size:4rem;padding:.1rem .7rem .2rem;margin:0 auto 2rem;transform:rotate(-4deg);transform-origin:center;border-radius:999px}.try>p{position:relative;margin:0 0 .375rem;padding-left:1rem}.try>p:before{content:"•";position:absolute;left:0;top:0;font-weight:600}.try>:first-child{margin-top:0}.try>:last-child{margin-bottom:0}.note{margin:1rem 0 1.5rem;padding:.75rem .875rem .875rem;background:#eee;border:2px dashed #000;border-radius:.75rem;position:relative;overflow:visible}.note:before{content:"note from munus";display:flex;align-items:center;font-weight:600;font-size:1em;margin-bottom:.5rem;min-height:4.5rem;margin-left:5rem}.note:after{content:"";position:absolute;top:-.5rem;left:-.5rem;width:6rem;height:6rem;background-image:url(/assets/my-notion-face-transparent.png);background-repeat:no-repeat;background-size:6rem 6rem;background-position:center;transform:rotate(12deg);filter:drop-shadow(.15rem .2rem 0 rgba(0,0,0,.2));pointer-events:none}.note>:first-child{margin-top:0}.note>:last-child{margin-bottom:0}footer{margin-top:3.75rem;padding-top:1rem;border-top:.0625rem solid var(--border);font-size:.85em;color:var(--muted)}a{color:inherit}kbd{display:inline-flex;align-items:center;justify-content:center;min-width:1.5em;height:1.5em;padding:0 .25em;background:orange;color:#000;border-radius:50%;font-family:inherit;font-size:.9em;font-weight:500;line-height:1;border:none;box-shadow:none}.bottom-nav{position:fixed;bottom:0;left:0;right:0;background:orange;display:flex;gap:.75rem;padding:.75rem 1.25rem;overflow-x:auto;overflow-y:hidden;white-space:nowrap;z-index:1000;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.3) transparent}.bottom-nav::-webkit-scrollbar{height:4px}.bottom-nav::-webkit-scrollbar-track{background:transparent}.bottom-nav::-webkit-scrollbar-thumb{background:#0000004d;border-radius:2px}.bottom-nav a{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .75rem;background:#fff;color:#000;border-radius:2rem;font-weight:500;text-decoration:none;transition:transform .2s,background .2s;flex-shrink:0;border:1px dashed black}.bottom-nav a:hover{transform:scale(1.05);background:#fff}.bottom-nav a:active{transform:scale(.95)}.bottom-nav a.is-active{background:#000;color:#fff;border-color:#000}.bottom-nav a.is-active .nav-letter{background:#fff;color:#000}.nav-letter{display:inline-flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;background:orange;color:#000;border-radius:50%;font-weight:600;flex-shrink:0}.nav-label{white-space:nowrap;font-size:.9rem}.content{padding-bottom:calc(6rem + env(safe-area-inset-bottom))}.section-jump{position:fixed;right:.8rem;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:.55rem;z-index:1001}.section-jump button{width:2.5rem;height:2.5rem;border:2px solid #000;border-radius:999px;background:#fff;color:#000;font:inherit;font-size:1.15rem;font-weight:600;line-height:1;cursor:pointer;box-shadow:0 .1rem #0003;transition:transform .15s ease,background .15s ease,color .15s ease,opacity .15s ease}.section-jump button:hover:not(:disabled){transform:translateY(-1px);background:orange}.section-jump button:active:not(:disabled){transform:translateY(0)}.section-jump button:disabled{cursor:not-allowed;opacity:.35}hr{width:100vw;margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);border:none;height:1px;background-image:linear-gradient(to right,#000 50%,transparent 50%);background-size:12px 1px;background-repeat:repeat-x;margin-top:2.5rem;margin-bottom:2.5rem}@media(max-width:37.5rem){body{font-size:1rem;line-height:1.34}.title-section{padding:1.1rem .7rem .85rem}h1{font-size:clamp(1.75rem,9.5vw,2.4rem);line-height:.95}h2{margin-top:1.65rem;font-size:1.22em;line-height:1.12}p,li{line-height:1.32;margin-bottom:.26rem}ul,ol{padding-left:1rem;margin-bottom:.6rem}.content{padding:0 .7rem calc(2rem + env(safe-area-inset-bottom))}.content table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}.content th,.content td{white-space:normal}.step{padding:.78rem .7rem .82rem .82rem;line-height:1.32;margin:.8rem 0 1.1rem}.step:before{width:1.62rem;height:1.62rem;font-size:.72rem;top:-.44rem;left:-.28rem}.content table{font-size:.85em}.content th,.content td{padding:.36rem .4rem}.try:before{font-size:clamp(1.9rem,9vw,2.6rem);margin-bottom:1rem;text-align:center;line-height:1}.note{padding:.66rem .66rem .7rem}.note:before{min-height:3.2rem;margin-left:3.7rem;margin-bottom:.32rem;font-size:.9rem}.bottom-nav{display:none}.note:after{width:4.2rem;height:4.2rem;background-size:4.2rem 4.2rem;top:-.28rem;left:-.3rem}.section-jump{top:auto;bottom:calc(.78rem + env(safe-area-inset-bottom));right:.45rem;transform:none}.section-jump button{width:2rem;height:2rem;font-size:.9rem}}@media(max-width:20rem){body{font-size:1rem;line-height:1.3}h1{font-size:clamp(1.62rem,10.7vw,2rem)}h2{font-size:1.16em}p,li{line-height:1.28}.content{padding:0 .56rem calc(1.65rem + env(safe-area-inset-bottom))}.note:before{margin-left:3.35rem;min-height:2.95rem}.note:after{width:3.8rem;height:3.8rem;background-size:3.8rem 3.8rem}.code-block pre code,.code-block pre code.hljs{padding:.7rem .72rem}}