body {
    margin:0
}

* {
    transition-duration: .2s;
    transition-property:background, border-color, opacity, box-shadow, top, bottom, left, margin, ri
}

.body {
    --dark-0: #000;
    --dark-00: #3b3b3b;
    --dark-1: #1e1e1e;
    --dark-2: #2e2e2e;
    --dark-3: #3e3e3e;
    --dark-4: #4e4e4e;
    --dark-5: #5e5e5e;
    --dark-6: #6e6e6e;
    --dark-7: #7e7e7e;
    --dark-8: #8e8e8e;
    --light-0: #fff;
    --light-00: #cacaca;
    --light-1: #e1e1e1;
    --light-2: #d1d1d1;
    --light-3: #c1c1c1;
    --light-4: #b1b1b1;
    --light-5: #a1a1a1;
    --light-6: #919191;
    --light-7: #818181;
    --light-8: #717171;
    --code-keyword-light: #bd2864;
    --code-keyword-dark: #bd2864;
    --code-string-light: #297a3a;
    --code-string-dark: #62c073;
    --code-function-light: #0068d6;
    --code-function-dark: #52a8ff;
    --code-constant-dark: #f8c555;
    --code-constant-light: #f08d49;
    --code-operator-dark: #67cdcc;
    --code-operator-light: #016464;
    --link-dark: #2563eb;
    --link-light: #3b82f6;
    --dark-0-60: rgba(0, 0, 0, .6);
    --light-0-60: rgba(255, 255, 255, .6);
    --text-f: "Inter";
    --title-f: "Inter";
    overflow-y:scroll;
}

.body[data-theme=dark] {
    color-scheme: dark;
    --main: var(--dark-0);
    --main-close: var(--dark-00);
    --main-hover: var(--dark-1);
    --secondary: var(--dark-1);
    --secondary-hover: var(--dark-2);
    --tertiary: var(--dark-2);
    --tertiary-hover: var(--dark-3);
    --accent: var(--dark-3);
    --accent-hover: var(--dark-4);
    --main-text: var(--light-0);
    --main-text-hover: var(--light-1);
    --secondary-text: var(--light-1);
    --secondary-text-hover: var(--light-2);
    --tertiary-text: var(--light-2);
    --tertiary-text-hover: var(--light-3);
    --accent-text: var(--light-3);
    --accent-text-hover: var(--light-4);
    --border: var(--dark-2);
    --border-hover: var(--light-7);
    --main-60: var(--dark-0-60);
    --code-keyword: var(--code-keyword-dark);
    --code-string: var(--code-string-dark);
    --code-function: var(--code-function-dark);
    --code-constant: var(--code-constant-dark);
    --code-operator: var(--code-operator-dark);
    --link: var(--link-light)
}

.body[data-theme=light] {
    color-scheme: light;
    --main: var(--light-0);
    --main-close: var(--light-00);
    --main-hover: var(--light-1);
    --secondary: var(--light-1);
    --secondary-hover: var(--light-2);
    --tertiary: var(--light-2);
    --tertiary-hover: var(--light-3);
    --accent: var(--light-3);
    --accent-hover: var(--light-4);
    --main-text: var(--dark-0);
    --main-text-hover: var(--dark-1);
    --secondary-text: var(--dark-1);
    --secondary-text-hover: var(--dark-2);
    --tertiary-text: var(--dark-2);
    --tertiary-text-hover: var(--dark-3);
    --accent-text: var(--dark-3);
    --accent-text-hover: var(--dark-4);
    --border: var(--light-1);
    --border-hover: var(--dark-8);
    --main-60: var(--light-0-60);
    --code-keyword: var(--code-keyword-light);
    --code-string: var(--code-string-light);
    --code-function: var(--code-function-light);
    --code-constant: var(--code-constant-light);
    --code-operator: var(--code-operator-light);
    --link: var(--link-dark)
}

.col {
    display: flex;
    flex-direction:column
}

.col-center {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content:center
}

.row {
    display: flex;
    flex-direction:row
}

.row-center {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content:center
}

.inset-0px {
    inset:0
}

.bottom-0 {
    bottom:0
}

.top-0 {
    top:0
}

.top-51px {
    top:51px
}

.line-clamp-3 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp:3
}

.hover\:z-5:hover {
    z-index:5
}

.m-\[2\.5px\] {
    margin:2.5px
}

.m17\.12 {
    margin:4.28rem
}

.m-x-10px {
    margin-left: 10px;
    margin-right:10px
}

.m-x-2\.5px {
    margin-left: 2.5px;
    margin-right:2.5px
}

.m-x-auto {
    margin-left: auto;
    margin-right:auto
}

.m-y-0px {
    margin-top: 0;
    margin-bottom:0
}

.m-y-10px, .my-\[10px\] {
    margin-top: 10px;
    margin-bottom:10px
}

.m-y-2 {
    margin-top: .5rem;
    margin-bottom:.5rem
}

.m-y-5 {
    margin-top: 1.25rem;
    margin-bottom:1.25rem
}

.m-y-auto {
    margin-top: auto;
    margin-bottom:auto
}

.m-b-15px {
    margin-bottom:15px
}

.m-b-2, .mb-2 {
    margin-bottom:.5rem
}

.m-b-40px {
    margin-bottom:40px
}

.m-b-5px {
    margin-bottom:5px
}

.m-l-1 {
    margin-left:.25rem
}

.m-l-auto {
    margin-left:auto
}

.m-r-5px {
    margin-right:5px
}

.m-t-10, .mt-10 {
    margin-top:2.5rem
}

.m-t-20px {
    margin-top:20px
}

.m-t-7 {
    margin-top:1.75rem
}

.m-t-8 {
    margin-top:2rem
}

.m-t-auto {
    margin-top:auto
}

.mb-5 {
    margin-bottom:1.25rem
}

.mb-7 {
    margin-bottom:1.75rem
}

.ml-0 {
    margin-left:0
}

.ml-2 {
    margin-left:.5rem
}

.mr-2 {
    margin-right:.5rem
}

.mt-5 {
    margin-top:1.25rem
}

.aspect-video {
    aspect-ratio:16/9
}

.h-\[1px\], .h-1px {
    height:1px
}

.h-100\%, .h-full {
    height:100%
}

.h-120px {
    height:120px
}

.h-15px {
    height:15px
}

.min-h-\[200px\] {
    min-height:200px
}

.w-\[0\.5px\] {
    width:.5px
}

.w-\[100\%\], .w-100\%, .w-full {
    width:100%
}

.w-\[20px\] {
    width:20px
}

.w-120px {
    width:120px
}

.w-150px {
    width:150px
}

.w-15px {
    width:15px
}

.w-75\% {
    width:75%
}

.flex {
    display:flex
}

.flex-\[0\.5\] {
    flex:.5
}

.gap-1 {
    gap:.25rem
}

.gap-10 {
    gap:2.5rem
}

.gap-10px {
    gap:10px
}

.gap-2 {
    gap:.5rem
}

.gap-3 {
    gap:.75rem
}

.gap-5 {
    gap:1.25rem
}

.gap-7 {
    gap:1.75rem
}

.border-\[var\(--border\)\] {
    border-color:var(--border)
}

.hover\:border-\[var\(--border-hover\)\]:hover {
    border-color:var(--border-hover)
}

.rounded {
    border-radius:.25rem
}

.rounded-\[15px\], .rounded-15px {
    border-radius:15px
}

.rounded-\[20px\] {
    border-radius:20px
}

.rounded-\[50\%\] {
    border-radius:50%
}

.rounded-10px {
    border-radius:10px
}

.rounded-xl {
    border-radius:.75rem
}

.bg-\[\#000000dd\] {
    --un-bg-opacity: .87;
    background-color:rgba(0, 0, 0, var(--un-bg-opacity))
}

.bg-\[transparent\], .bg-transparent {
    background-color:transparent
}

.bg-\[var\(--accent\)\] {
    background-color:var(--accent)
}

.bg-\[var\(--border\)\] {
    background-color:var(--border)
}

.bg-\[var\(--main-60\)\] {
    background-color:var(--main-60)
}

.bg-\[var\(--main-hover\)\] {
    background-color:var(--main-hover)
}

.bg-\[var\(--main\)\] {
    background-color:var(--main)
}

.hover\:bg-\[color\:var\(--main-hover\)\]:hover {
    background-color:var(--main-hover)
}

.hover\:bg-\[var\(--accent-hover\)\]:hover {
    background-color:var(--accent-hover)
}

.hover\:bg-\[var\(--main-hover\)\]:hover {
    background-color:var(--main-hover)
}

.p-10px {
    padding:10px
}

.p-15px {
    padding:15px
}

.p-2 {
    padding:.5rem
}

.p-25px {
    padding:25px
}

.p-5 {
    padding:1.25rem
}

.p-50px {
    padding:50px
}

.p-5px {
    padding:5px
}

.p-x-0px {
    padding-left: 0;
    padding-right:0
}

.p-x-10px, .px-10px {
    padding-left: 10px;
    padding-right:10px
}

.p-x-2, .px-2 {
    padding-left: .5rem;
    padding-right:.5rem
}

.p-x-5 {
    padding-left: 1.25rem;
    padding-right:1.25rem
}

.p-y-0px {
    padding-top: 0;
    padding-bottom:0
}

.p-y-15px {
    padding-top: 15px;
    padding-bottom:15px
}

.p-y-20 {
    padding-top: 5rem;
    padding-bottom:5rem
}

.px, .px-4 {
    padding-left: 1rem;
    padding-right:1rem
}

.px-\[15px\] {
    padding-left: 15px;
    padding-right:15px
}

.px-\[20px\] {
    padding-left: 20px;
    padding-right:20px
}

.px-6 {
    padding-left: 1.5rem;
    padding-right:1.5rem
}

.py-\[10px\] {
    padding-top: 10px;
    padding-bottom:10px
}

.py-\[5px\] {
    padding-top: 5px;
    padding-bottom:5px
}

.py-3 {
    padding-top: .75rem;
    padding-bottom:.75rem
}

.py-4 {
    padding-top: 1rem;
    padding-bottom:1rem
}

.py-50px {
    padding-top: 50px;
    padding-bottom:50px
}

.pb-1 {
    padding-bottom:.25rem
}

.pb-10 {
    padding-bottom:2.5rem
}

.pt-3 {
    padding-top:.75rem
}

.text-\[0\.9em\], .text-0\.9em {
    font-size:.9em
}

.text-\[1\.15em\], .text-1\.15em {
    font-size:1.15em
}

.text-\[1\.2em\] {
    font-size:1.2em
}

.text-\[1\.3em\], .text-1\.3em {
    font-size:1.3em
}

.text-0\.85em {
    font-size:.85em
}

.text-0\.8em {
    font-size:.8em
}

.text-1\.25em {
    font-size:1.25em
}

.text-1em {
    font-size:1em
}

.text-2\.5em {
    font-size:2.5em
}

.text-2em {
    font-size:2em
}

.text-3\.5em {
    font-size:3.5em
}

.text-sm {
    font-size: .875rem;
    line-height:1.25rem
}

.font-300, .font-light {
    font-weight:300
}

.font-400 {
    font-weight:400
}

.font-500 {
    font-weight:500
}

.font-black {
    font-weight:900
}

.font-bold {
    font-weight:700
}

.font-extralight {
    font-weight:200
}

.tracking-\[4px\] {
    letter-spacing:4px
}

.tracking-wider {
    letter-spacing:.05em
}

.font-\[var\(--title-f\)\] {
    font-family:var(--title-f)
}

.font-italic {
    font-style:italic
}

.\ !text-\[var\(--secondary-text\)\] {
    color:var(--secondary-text) !important
}

.text-\[inherit\], .text-inherit {
    color:inherit
}

.text-\[var\(--accent-text\)\] {
    color:var(--accent-text)
}

.text-\[var\(--border\)\] {
    color:var(--border)
}

.text-\[var\(--main-close\)\] {
    color:var(--main-close)
}

.text-\[var\(--secondary-text\)\] {
    color:var(--secondary-text)
}

.text-\[var\(--tertiary-text\)\] {
    color:var(--tertiary-text)
}

.text-\[var\(--text\)\] {
    color:var(--text)
}

.decoration-none {
    text-decoration:none
}

.hover\:grayscale-0:hover {
    --un-grayscale: grayscale(0);
    filter:var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia)
}

.duration-\[150ms\] {
    transition-duration:.15s
}

.ease {
    transition-timing-function:cubic-bezier(.4, 0, .2, 1)
}

.markdown-container {
    --code-comment: var(--tertiary-text);
    --code-punctuation: var(--main-text);
    --code-builtin: var(--secondary-text);
    --code-number: var(--secondary-text);
    --code-interpolation: var(--code-keyword);
    --code-class-name: var(--secondary-text);
    font-family: Space Mono, monospace;
    font-size: 14px;
    color: var(--tertiary-text);
    overflow-y:auto !important
}

.markdown-container code[class * =language-], .markdown-container pre[class * =language-] {
    overflow-x: auto;
    min-width: 0px;
    color:var(--main-text-hover)
}

.markdown-container pre[class * =language-] {
    margin-top: 1em;
    margin-bottom:1em
}

.markdown-container .token.selector, .markdown-container .token.important, .markdown-container .token.atrule, .markdown-container .token.keyword {
    color:var(--code-keyword)
}

.markdown-container .token.punctuation {
    color:var(--code-punctuation)
}

.markdown-container .token.string {
    color:var(--code-string)
}

.markdown-container .token.function {
    color:var(--code-function)
}

.markdown-container .token.comment {
    color:var(--code-comment)
}

.markdown-container .token.token.builtin {
    color:var(--code-builtin)
}

.markdown-container .token.token.number {
    color:var(--code-number)
}

.markdown-container .token.token.constant {
    color:var(--code-constant)
}

.markdown-container .token.token.operator {
    color:var(--code-operator)
}

.markdown-container .token.token.interpolation {
    color:var(--code-interpolation)
}

.markdown-container .token.token.class-name {
    color:var(--code-function)
}

.markdown-container h1, .markdown-container h2, .markdown-container h3 {
    color: var(--text);
    margin-bottom:.45em
}

.markdown-container h1 {
    font-size:2em
}

.markdown-container h2 {
    font-size:1.8em
}

.markdown-container h3 {
    font-size:1.6em
}

.markdown-container h4 {
    font-size:1.45em
}

.markdown-container h5 {
    font-size:1.3em
}

.markdown-container h6 {
    font-size:1.2em
}

.markdown-container p {
    line-height:1.75rem
}

.markdown-container ul {
    margin: 0;
    padding:0 20px
}

.markdown-container li {
    padding: 5px 0;
    line-height:1.75rem
}

.markdown-container a {
    color:var(--link)
}

.markdown-container :is(code):not(pre code) {
    color: var(--accent-text);
    background-color: var(--tertiary);
    padding: 1px 6px;
    border-radius:.25em
}

.markdown-container :not(pre) > code[class * =language-], .markdown-container pre[class * =language-] {
    background-color: var(--main-hover);
    border: 1px solid var(--border);
    border-radius: .25em;
    font-size:.9em
}

.markdown-container :not(pre) > code[class * =language-]:hover, .markdown-container pre[class * =language-]:hover {
    background-color: var(--secondary-hover);
    border-color:var(--border-hover)
}

.markdown-container a :is(code):not(pre code) {
    color:inherit
}

.markdown-container blockquote {
    padding: 5px 20px;
    background-color: var(--main-hover);
    border: 1px solid var(--dividerLight);
    margin-right: 0;
    margin-left: 0;
    border-radius:.25em
}

.markdown-container blockquote strong {
    font-style:normal
}

.markdown-container hr {
    border-top: .5px solid var(--border-low);
    color: var(--border-low);
    margin:30px 0
}

.content .mb6t29 {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding:0
}

.body .mb6t29 {
    margin: 0;
    background-color: var(--main);
    color: var(--main-text);
    font-family: var(--text-f);
    display: flex;
    flex-direction: column;
    transition-duration: .2s;
    letter-spacing: 1px;
    min-height:100vh
}

p {
    margin:0
}

h1, h2, h3, h4, h5, h6 {
    margin: 5px 0
}
