h1{margin-block-start:7rem}header[data-astro-cid-3ef6ksr2].header{display:flex;gap:2rem;justify-items:center;align-items:center;padding:1rem;margin-inline:auto;width:max-content;max-width:100vw;background-color:color-mix(in oklab,white,transparent 50%);backdrop-filter:blur(10px);top:0;z-index:1000;position:absolute;border-radius:1.5rem;&.border-bottom{border-bottom:1px solid color-mix(in srgb,var(--primary-1),transparent 70%)}&.fixed{position:fixed;left:50%;transform:translate(-50%,.5rem)}&[data-astro-cid-3ef6ksr2]:not(:has(a.logo)){justify-content:space-evenly}>nav button{display:none;box-shadow:none;>:global(svg){fill:var(--primary-1)}@media screen and (max-width: 800px){display:flex;border:none;background-color:unset;cursor:pointer}}a.logo{letter-spacing:.015em;color:var(--primary-1);text-align:center;font-size:1.3rem;font-weight:900;& span.flip-text-h{transform:scaleX(-1);display:inline-block}@media screen and (max-width: 800px){font-size:1rem}}nav div.popover-wrapper{border:none;top:0;margin-block-start:0;transition:transform .5s,opacity .5s,display .5s,color .5s,height .2s;@media screen and (max-width: 800px){background-color:var(--primary-1);&::backdrop{background-color:var(--primary-1);height:75vh}& ul{flex-direction:column;gap:1rem;& a{color:#fff}}}&:popover-open{padding:10vh 10vw;opacity:1;transform:translateY(0) scale(1);@starting-style{opacity:0;transform:translateY(-20px) scale(.9)}}@media screen and (min-width: 800px){display:block;position:relative;background-color:unset}& ul{display:flex;gap:3rem;list-style-type:none;padding-inline-start:0;margin-block:0;@media screen and (min-width: 800px){gap:2rem}}}a.button{justify-self:start}a:not(.button){text-decoration:none;font-size:1rem;font-weight:300;text-transform:capitalize;color:var(--color-text-bw);&.active{color:var(--primary-1)}}@media screen and (max-width: 800px){@supports not selector(:popover-open){[popover]:not(.\:popover-open){display:none}div.popover-wrapper ul{width:100vw;height:65vh;align-items:center;padding-block-start:10vh}}}}@media screen and (max-width: 800px){header[data-astro-cid-3ef6ksr2].header nav[data-astro-cid-3ef6ksr2] div[data-astro-cid-3ef6ksr2].popover-wrapper::backdrop{background-color:var(--primary-1);height:75vh}}@keyframes astroFadeInOut{0%{opacity:1}to{opacity:0}}@keyframes astroFadeIn{0%{opacity:0;mix-blend-mode:plus-lighter}to{opacity:1;mix-blend-mode:plus-lighter}}@keyframes astroFadeOut{0%{opacity:1;mix-blend-mode:plus-lighter}to{opacity:0;mix-blend-mode:plus-lighter}}@keyframes astroSlideFromRight{0%{transform:translate(100%)}}@keyframes astroSlideFromLeft{0%{transform:translate(-100%)}}@keyframes astroSlideToRight{to{transform:translate(100%)}}@keyframes astroSlideToLeft{to{transform:translate(-100%)}}@media (prefers-reduced-motion){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}[data-astro-transition-scope]{animation:none!important}}footer[data-astro-cid-sz7xmlte]{padding:75px 20px 45px;text-align:center;margin-block-start:auto;border-block-start:1px solid color-mix(in srgb,var(--primary-color),transparent 70%);color:var(--primary-color);display:flex;justify-content:center;ul{flex-wrap:wrap;justify-content:center}li{padding-inline:2rem}}@font-face{font-family:Space Grotesk Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(/_astro/space-grotesk-vietnamese-wght-normal.D0rl6rjA.woff2) format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Space Grotesk Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(/_astro/space-grotesk-latin-ext-wght-normal.D9tNdqV9.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Space Grotesk Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(/_astro/space-grotesk-latin-wght-normal.BhU9QXUp.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@layer reset,base,utilities,overrides;@layer reset{*,*:before,*:after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}ul[role=list],ol[role=list]{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1.1}h1,h2,h3,h4{text-wrap:balance}p{text-wrap:pretty}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}img{max-width:100%;height:auto;vertical-align:middle;font-style:italic;background-repeat:no-repeat;background-size:cover;shape-margin:1rem;object-fit:cover}input,button,textarea,select{font:inherit}textarea:not([rows]){min-height:10em}:target{scroll-margin-block:5ex}a{line-break:normal}}@layer base{:root{color-scheme:light dark;@media (prefers-reduced-motion: no-preference){interpolate-size:allow-keywords}--beige: #e9dac4;--beige-light: #f5f5f5;--black-1: #181614;--black-2: #58544d;--green: #017e7d;--green-light: #6d928a;--green-dark: #024b48;--blue: #036c9f;--blue-dark: #054164;--yellow: #f1bb62;--yellow-dark: #d2a220;--orange-light: #f7ab06;--orange: #f18e22;--orange-dark: #d6581d;--red: #c01320;--turquoise: #0f8395;--turquoise-dark: #0c4b59;--magenta-light: #f18e9d;--magenta: #a11a51;--magenta-dark: #500721;--lavender-light: #e3efff;--lavender: #8c90b6;--lavender-dark: #4b4e6e;--light-emerald: #ebfffd;--emerald: #00cdb8;--emerald-dark: #00a79d;--forms-accent-color: deeppink;--color-primary: var(--emerald);--color-primary-light: var(--light-emerald);--serif-font: "Space Grotesk Variable", sans-serif;--sans-serif-font: sans-serif;--monospace-font: monospace;--custom-font: "Space Grotesk Variable", sans-serif;--primary-1: var(--black-1);--primary-1-light: color-mix(in srgb, var(--primary-1), transparent 70%);--bg-color-light: light-dark(var(--light-emerald), var(--emerald));--bg-color-accent: light-dark(var(--emerald), var(--light-emerald));--bg-opacity: 80;--color-text-primary: light-dark(var(--emerald-dark), var(--light-emerald));--color-text-primary-reversed: light-dark(var(--light-emerald), var(--emerald-dark));--color-text-bw: light-dark(var(--black-1), var(--beige-light));--color-text-bw-reversed: light-dark(var(--beige-light), var(--black-1));--headings-font: var(--serif-font), sans-serif;--body-font: var(--serif-font), sans-serif;--radius-1: .5rem;--box-shadow-1: 0 0 10px 0 color-mix(in srgb, var(--primary-1), transparent 50%);--box-shadow-2: 0 0 20px 0 color-mix(in srgb, var(--primary-1), transparent 50%)}html{font-family:var(--body-font);accent-color:var(--primary-1);background-color:var(--bg-color-light);background-image:radial-gradient(var(--bg-color-accent) .9500000000000001px,var(--bg-color-light) .9500000000000001px);background-size:19px 19px;color:var(--color-text-bw)}body{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;min-height:100vh;margin:0;accent-color:var(--forms-accent-color)}main{--width-main: 800px;margin-inline:auto;padding:1rem;width:var(--width-main);max-width:calc(100% - 2rem);font-size:20px;line-height:1.6;@media screen and (max-width: 800px){width:100%;--width-main: calc(100vw - 4rem) }}p{text-wrap:balance;&::selection{background-color:var(--bg-color-accent);color:var(--bg-color-light)}}ul{list-style-type:none;padding-inline-start:0;display:flex}h1,h2,h3{font-family:var(--headings-font);font-weight:700;font-variation-settings:"wght" 722;color:var(--color-text-primary);text-wrap:pretty;&::selection{background-color:var(--bg-color-accent);color:var(--bg-color-light)}}h1{color:var(--color-text-primary);text-align:center;font-size:clamp(3rem,8vw,3.5rem);font-style:italic}button,a.button{padding:10px 20px;background-color:#fff;color:var(--text-color);border:1px solid currentColor;border-radius:var(--radius-1);cursor:pointer;font-family:var(--body-font);text-transform:uppercase;text-decoration:none;text-align:center}h2{font-size:2.5rem;font-size:clamp(2.5rem,6vw,2.5rem);margin-block:1rem;margin-bottom:2rem}section{margin-block:clamp(5rem,10vw,10rem)}h1,h2{scroll-margin-block-start:10rem}a[href^=http][target=_blank]:not(:has(span.screen-rea,.no-external-link-iconder)){padding-inline-end:1.7em}a[href^=http][target=_blank]:not(:has(span.screen-reader),.no-external-link-icon):after{position:absolute;content:"";display:inline-block;width:1em;height:1em;margin-inline-start:.25em;background-size:100%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 12.2 12.2' width='14' height='14'%3E%3Cpath d='M5.7 0v1.5h4L4.5 6.7l1 1.1 5.3-5.2v3.9h1.4V0z'/%3E%3Cpath fill='none' d='M3.4 6.7l3-2.9H1.5v7h7V5.9l-3 2.9z'/%3E%3Cpath d='M8.5 5.9v4.9h-7v-7h4.9l1.5-1.6H0v10h10V4.4z'/%3E%3C/svg%3E");transform:translateY(.25em);opacity:.7}@media (prefers-color-scheme: dark){a[href^=http][target=_blank]:not(:has(span.screen-reader),.no-external-link-icon):after{filter:invert(1)}}h2,p{text-align:center}.dual-cards-responsive{display:flex;flex-wrap:wrap;gap:20px;container-type:inline-size;justify-content:space-around;width:100%;>li{width:100%}@container (min-width: 700px){>li{width:45%}}}h2:has(svg+span){svg{margin-inline-end:.5em}}.back-link-row{width:min(80vw,100%);display:flex;justify-content:flex-start;margin-inline:auto;margin-block-start:4rem;& a.back-link-button{color:color-mix(in oklab,var(--text-primary),transparent 25%);border:1px solid transparent;padding:20px 30px;text-decoration:none;border-radius:15px;display:flex;align-items:center;transition:border-color .2s ease-in-out;&:hover{color:var(--text-primary);border-color:currentColor;transition:border-color .2s ease-in-out}& svg{margin-right:10px}}}}@layer components{input[type=text]{padding:.2rem .7rem;border-radius:.5rem}.input-file-container{position:relative;width:300px}.input-file-trigger{display:block;padding:14px 45px;background:var(--yellow-1);color:#000;font-size:1em;transition:all .2s;cursor:pointer;border-radius:8rem;text-align:center;padding-inline-start:2rem}.input-file{position:absolute;top:0;left:0;width:225px;opacity:0;padding:14px 0}:is(.input-file-container,input[type=file i],input[type=file].input-file,.input-file-trigger):hover{cursor:pointer}.input-file:is(:hover,:focus,:focus-visible)+.input-file-trigger,.input-file-trigger:is(:hover,:focus,:focus-visible){background:color-mix(in oklab,var(--yellow-1),#000000 70%);color:var(--yellow-1)}.input-file:focus-visible+.input-file-trigger{outline:2px solid var(--yellow-1)}.input-file:active+.input-file-trigger{background:color-mix(in oklab,var(--yellow-1),#000000 80%);color:color-mix(in oklab,var(--yellow-1),#000000 10%)}.file-return{margin:0}.file-return:not(:empty){margin:1em 0}.file-return{font-style:italic;font-size:.9em;font-weight:700}.file-return:not(:empty):before{content:"Imported file: ";font-style:normal;font-weight:400}}@layer components{.button-slick{width:9em;height:3em;border-radius:30em;font-size:15px;font-family:inherit;border:none;position:relative;overflow:hidden;z-index:1;box-shadow:6px 6px 12px #c5c5c5,-6px -6px 12px #fff;&:before{content:"";width:0;height:3em;border-radius:30em;position:absolute;top:0;left:0;background-image:linear-gradient(to right,#0fd850,#f9f047);transition:.5s ease;display:block;z-index:-1}&:hover:before{width:9em}}:root{--shiny-cta-bg: #000000;--shiny-cta-bg-subtle: #1a1818;--shiny-cta-fg: #ffffff;--shiny-cta-highlight: var(--green-1);--shiny-cta-highlight-subtle: var(--green-2)}@property --gradient-angle{syntax: "<angle>"; initial-value: 0deg; inherits: false;}@property --gradient-angle-offset{syntax: "<angle>"; initial-value: 0deg; inherits: false;}@property --gradient-percent{syntax: "<percentage>"; initial-value: 5%; inherits: false;}@property --gradient-shine{syntax: "<color>"; initial-value: white; inherits: false;}.shiny-cta{--animation: gradient-angle linear infinite;--duration: 3s;--shadow-size: 2px;isolation:isolate;position:relative;overflow:hidden;cursor:pointer;outline-offset:4px;padding:1.25rem 2.5rem;font-family:inherit;font-size:1.125rem;line-height:1.2;border:1px solid transparent;border-radius:360px;color:var(--shiny-cta-fg);background:linear-gradient(var(--shiny-cta-bg),var(--shiny-cta-bg)) padding-box,conic-gradient(from calc(var(--gradient-angle) - var(--gradient-angle-offset)),transparent,var(--shiny-cta-highlight) var(--gradient-percent),var(--gradient-shine) calc(var(--gradient-percent) * 2),var(--shiny-cta-highlight) calc(var(--gradient-percent) * 3),transparent calc(var(--gradient-percent) * 4)) border-box;box-shadow:inset 0 0 0 1px var(--shiny-cta-bg-subtle);&:before,&:after,span:before{content:"";pointer-events:none;position:absolute;inset-inline-start:50%;inset-block-start:50%;translate:-50% -50%;z-index:-1}&:active{translate:0 1px}&:before{--size: calc(100% - var(--shadow-size) * 3);--position: 2px;--space: calc(var(--position) * 2);width:var(--size);height:var(--size);background:radial-gradient(circle at var(--position) var(--position),white calc(var(--position) / 4),transparent 0) padding-box;background-size:var(--space) var(--space);background-repeat:space;mask-image:conic-gradient(from calc(var(--gradient-angle) + 45deg),black,transparent 10% 90%,black);border-radius:inherit;opacity:.4;z-index:-1}&:after{--animation: shimmer linear infinite;width:100%;aspect-ratio:1;background:linear-gradient(-50deg,transparent,var(--shiny-cta-highlight),transparent);mask-image:radial-gradient(circle at bottom,transparent 40%,black);opacity:.6}& span{z-index:1;&:before{--size: calc(100% + 1rem) ;width:var(--size);height:var(--size);box-shadow:inset 0 -1ex 2rem 4px var(--shiny-cta-highlight);opacity:0}}&:hover{box-shadow:inset 0 0 0 1px var(--shiny-cta-bg-subtle),0 0 0 1px var(--shiny-cta-highlight-subtle);transition:all .3s ease-in-out}}.shiny-cta{--transition: .8s cubic-bezier(.25, 1, .5, 1);transition:var(--transition);transition-property:--gradient-angle-offset,--gradient-percent,--gradient-shine;&,&:before,&:after{animation:var(--animation) var(--duration),var(--animation) calc(var(--duration) / .4) reverse paused;animation-composition:add}span:before{transition:opacity var(--transition);animation:calc(var(--duration) * 1.5) breathe linear infinite}&:is(:hover,:focus-visible){--gradient-percent: 20%;--gradient-angle-offset: 95deg;--gradient-shine: var(--shiny-cta-highlight-subtle);&,&:before,&:after{animation-play-state:running}span:before{opacity:1}}}@keyframes gradient-angle{to{--gradient-angle: 360deg}}@keyframes shimmer{to{rotate:360deg}}@keyframes breathe{0%,to{scale:1}50%{scale:1.2}}}@layer components{.backlight{position:relative;text-align:center;background-color:#151823;animation:textColor 10s ease infinite;@keyframes textColor{0%{color:#7e0fff}50%{color:#0fffc1}to{color:#7e0fff}}&:after{position:absolute;content:"";top:0;left:0;right:0;z-index:-1;height:100%;width:100%;margin:0 auto;transform:scale(.75);filter:blur(5vw);background:linear-gradient(270deg,#0fffc1,#7e0fff);background-size:200% 200%;animation:animateGlow 10s ease infinite;@keyframes animateGlow{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}}}}@layer utilities{.visually-hidden{position:absolute;clip:rect(1px,1px,1px,1px);padding:0;border:0;height:1px;width:1px;overflow:hidden;white-space:nowrap}.text-align-center{text-align:center}.serif{font-family:var(--serif-font)}.mono{font-family:var(--monospace-font);font-weight:200;font-size:.8em}.strong{font-weight:500}.italic{font-style:italic}.primary-color{color:var(--primary-1)}.big-2{font-size:2em}.flex-column{display:flex;flex-direction:column}.mt-0{margin-top:0!important}.pt-0{padding-top:0!important}}details[data-astro-cid-xa7lisrp]{--outer-inline-padding: 2rem;--outer-block-padding: 1.5rem;width:fit-content;border:1px solid var(--bg-color-accent);border-radius:.5rem;height:auto;summary{padding:var(--outer-block-padding) var(--outer-inline-padding);margin:0;font-size:var(--font-size-preview, 1.5rem);font-weight:var(--font-weight-preview, 400);font-style:var(--font-italic-preview, normal);cursor:pointer;list-style:none;& p{font-family:var(--font-family);margin:0;text-align:start}}&::details-content{opacity:0;block-size:0;overflow-y:clip;transition:content-visibility .2s allow-discrete,opacity .2s,block-size .2s;transition-timing-function:ease-in-out;padding-inline:var(--outer-inline-padding)}& ul{display:flex;gap:1rem;flex-wrap:wrap}&[open]::details-content{opacity:1;block-size:auto;overflow:clip;padding-block-end:var(--outer-block-padding)}div.favourites-and-collections-actions{display:flex;gap:1rem;& button{width:2rem;height:2rem;padding:0;background:none;border:none;aspect-ratio:1 / 1;display:grid;place-items:center;& svg{opacity:.8}&:hover{cursor:pointer;background-color:color-mix(in oklab,var(--bg-color-accent),transparent 70%);svg{scale:1.1;opacity:1}}&[data-is-favourite=true]{.is-favourite{display:inline}.is-not-favourite{display:none}}&[data-is-favourite=false]{.is-favourite{display:none}.is-not-favourite{display:inline}}}}}form[data-astro-cid-kqqbcqnx]{margin:1.5rem;padding:1.5rem 2rem;display:flex;flex-direction:column;align-items:start;flex-wrap:wrap;gap:2rem;outline:1px solid currentColor;border-radius:1.5rem;color:var(--primary-1);background-color:color-mix(in oklab,white,transparent 50%);backdrop-filter:blur(10px);>p[data-astro-cid-kqqbcqnx].form-description{font-weight:700;text-transform:uppercase;font-style:oblique;display:flex;align-items:centr;>svg[data-astro-cid-kqqbcqnx]{width:1.2rem;height:1.2rem;margin-inline-end:.5rem;opacity:.7}}div.inputs-wrapper{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));div{display:flex;flex-direction:column;align-items:start;width:15rem}input[type=range]{width:100%}}}div[data-astro-cid-kqqbcqnx]#fonts-preview-list{padding:1rem 2rem;>ul[data-astro-cid-kqqbcqnx]{display:grid;gap:2rem;& li[data-astro-cid-kqqbcqnx]:has(details[hidden]){display:none}}}.input-description[data-astro-cid-kqqbcqnx]{font-weight:700;margin-block-end:.5rem}svg[data-astro-cid-tvrurpns]{fill:var(--bg-color-light, #fff);&.small{width:82px;height:113px}}
