@layer reset{*,*:before,*:after{box-sizing:border-box}body,h1,h2,h3,h4,h5,h6,p,figure,dl,dd{margin:0}ul:where([class]),ol:where([class]){margin:0;padding:0;list-style:none}img{display:block;max-width:100%;height:auto}button,input,optgroup,select,textarea{font-family:inherit}}:root{--spacer: 1rem;--section-spacer: 5rem;--text-color: hsl(0 0% 0%);--text-color-light: hsl(0 0% 100%);--highlight-color: hsl(209 56% 45%)}body{height:100dvh;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:1rem;color:var(--text-color);line-height:1.2;display:grid;grid-template-rows:auto 1fr auto}main{padding-block:4rem}footer{padding-block:1.5rem;background-color:#f8f8ff}.wrapper{width:min(100% - 4rem,70rem);margin-inline:auto}.wrapper>section+section{margin-block-start:var(--section-flow, var(--section-spacer))}.flow-content>*+*{margin-block-start:var(--flow-space, var(--spacer))}h1,h2,h3,h4,h5,h6{font-weight:800;color:#4d4d4d;line-height:.9}h1{font-size:2rem}h1.red{color:tomato}p{max-width:75ch}p.info{width:fit-content;margin-inline-start:2rem;padding:1rem 1rem 1rem 1.5rem;background-color:#f0fff0;border:2px solid seagreen;border-radius:.25rem;position:relative}p.info svg{box-sizing:content-box;position:absolute;top:50%;padding:.5rem;background-color:#f0fff0;border:2px solid seagreen;stroke:#2e8b57;border-radius:100vw;transform:translate(-3.5rem,-50%)}p.todo{width:fit-content;margin-inline-start:2rem;padding:1rem 1rem 1rem 1.5rem;background-color:#ffe4e1;border:2px solid firebrick;border-radius:.25rem;position:relative}p.todo svg{box-sizing:content-box;position:absolute;top:50%;padding:.5rem;background-color:#ffe4e1;border:2px solid firebrick;stroke:#b22222;border-radius:100vw;transform:translate(-3.5rem,-50%)}span.html{padding-inline:.25rem;border-radius:3px;background-color:#06f;color:#fff}span.css{padding-inline:.25rem;border-radius:3px;background-color:#938;color:#fff}span.javascript{padding-inline:.25rem;border-radius:3px;background-color:#ffd600}a{color:inherit;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;text-decoration-color:var(--text-color)}a:hover{text-decoration-thickness:2px}a:focus-visible{outline:.25em solid currentColor;outline-offset:.125em}.articlenav{width:fit-content;margin-block:2rem;padding:1.5rem;background-color:#e6e6fa}.articlenav ul{margin:unset;padding-inline-start:1rem}.articlenav a{text-decoration:none}main ul li,main ol li{line-height:1.5;max-width:75ch}button{box-sizing:border-box;padding:1em 3em;background-color:#b22222;border:none;color:#fff;cursor:pointer}button:is(:hover,:focus-visible){outline:3px solid black;outline-offset:3px;box-shadow:0 0 0 9px #fff;border-radius:.125rem}button *{pointer-events:none}code{padding-block:.125rem;padding-inline:.25em;border-radius:.25em;background-color:#eee;color:currentColor;font-family:monospace;font-size:.875rem}.astro-code code{all:unset}pre,.codeblock{padding:.5rem 1rem;background-color:#d3d3d3;border-radius:.25rem}pre.astro-code{width:fit-content;text-wrap:balance}kbd{padding:.125rem;border:1px solid gainsboro;border-radius:4px;font-size:.875rem;box-shadow:0 3px #0307102e}.btn{opacity:.1;transition:padding 1s ease-in-out,background-color 1s ease-in-out,transform 1s ease-in-out,opacity 1s ease-in-out}.btn.is-active{padding:3rem;background-color:#2e8b57;transform:translate(3rem);opacity:1}*:focus{outline:5px solid lime}*:focus:not(:focus-visible){outline:unset}*:focus-visible{outline:3px solid black;outline-offset:3px;box-shadow:0 0 0 9px #fff;border-radius:.125rem}.visually-hidden:not(:focus):not(:active){position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden;white-space:nowrap}.visually-hidden:is(:focus-visible,:active){position:relative;width:inherit;height:auto;clip-path:inherit;overflow:inherit;white-space:inherit;z-index:1}[hidden],.is-hidden{display:none}header{padding-block:1rem;border-block-end:1px solid ghostwhite;box-shadow:0 2px 1px #03071214,0 7px 4px #0307120f,0 16px 9px #0307120d,0 28px 15px #03071208,0 44px 24px #03071205}header .wrapper{display:flex;justify-content:space-between;align-items:center}nav ul{list-style:none;margin:0;padding:0;min-width:max-content;display:flex;gap:.5rem}nav ul li[data-has-children]{position:relative}nav ul.level_2{display:none;position:absolute;top:2.5rem;left:0;flex-direction:column;gap:unset;background-color:#fff;border-top:1px solid lightgrey;box-shadow:0 2px 1px #03071214,0 7px 4px #0307120f,0 16px 9px #0307120d,0 28px 15px #03071208,0 44px 24px #03071205}nav ul.level_2.is-shown{display:flex}nav ul.level_3{display:none}nav ul.level_3.is-shown{display:flex;flex-direction:column;gap:unset}nav ul.level_3.is-shown a,nav ul.level_3.is-shown span{padding-inline-start:1.5rem}nav li :not(:last-of-type){border-bottom:1px solid lightgrey}nav ul.level_3.is-shown>li:first-of-type{border-top:1px solid lightgrey}nav a,nav span{display:block}nav a,nav .nav-btn{padding:.75rem}nav a:hover,nav .nav-btn:hover{background-color:beige}nav a{text-decoration:none}nav a:hover{color:#b22222}nav a[aria-current=page]{font-weight:700}nav button{all:unset;box-sizing:border-box;cursor:pointer}nav button:hover{color:#b22222}nav li[data-has-children] .nav-btn{width:100%}nav button.nav-btn{display:inline-flex;gap:.25em;align-items:flex-end}nav button.nav-btn[aria-expanded=false] svg{transition:transform .2s linear}nav button.nav-btn[aria-expanded=true]{background-color:beige}nav button.nav-btn[aria-expanded=true] svg{transition:transform .2s linear;transform:rotate(-180deg)}.accordion-group{width:min(80ch,100%)}.accordion{border-block-end:1px solid white}.acc-header h4{margin-block-end:unset;width:100%;color:#fff}.acc-header button{box-sizing:border-box;width:100%;padding:.75rem 1rem;display:flex;justify-content:space-between;align-items:center}.acc-header .lucide-minus{display:none}.is-open .acc-header .lucide-minus{display:inline-block}.is-open .acc-header .lucide-plus{display:none}.acc-content{height:0;overflow:hidden;transition:height .3s ease-out}.is-open .acc-content{height:10rem}.acc-content .acc-inner{margin-block-start:unset;padding:1rem;background-color:#ffe4e1;border:2px solid firebrick}.carousel{display:grid;grid-template-columns:2rem 30vw 2rem;grid-template-rows:40vh 3em;align-items:center;grid-gap:1em}.carousel button{all:unset;cursor:pointer}.carousel button:focus-visible{outline:5px lime}.carousel button svg{width:2rem;height:2rem;fill:#b22222}.carousel button.inactive svg{fill:#b4222266}.carousel-content-container{width:30vw;height:40vh;overflow:hidden}.carousel-contents{position:relative;width:100%;height:100%;transform:translate(0);transition:transform .3s ease-out}.carousel-slide{position:absolute;width:inherit;height:inherit}.carousel-slide>a{display:block;width:inherit;height:inherit}.carousel-slide img{width:inherit;height:inherit;object-fit:cover;object-position:center center}.carousel>*:nth-child(2){grid-column:2;align-self:stretch}.carousel-dots{grid-column:1/-1;justify-self:center}button.carousel-dot{width:1em;height:1em;padding:0;border-radius:100%;background-color:#b4222266}.carousel-dot+.carousel-dot{margin-left:1em}.carousel-dot:hover,.carousel-dot.is-selected{background-color:#b22222}iframe{width:100%;height:auto}details{width:min(100%,75ch);padding:1rem;background-color:#f8f8ff;cursor:pointer}details+details{margin-block-start:1rem}details summary{font-weight:700}details summary+p,details summary+ul,details summary+ol{margin-block-start:.5rem}.disclosure-widget{padding:1.5rem;background-color:beige}.disclosure-widget button{padding:0;display:flex;gap:.5rem;align-items:center;background:none;border:none;color:currentColor}.disclosure-widget button svg{width:1em;height:1em;transition:transform .2s linear}.disclosure-widget button[aria-expanded=true] svg{transform:rotate(90deg);transition:transform .2s linear}.disclosure-widget button[aria-expanded=false]+div{display:none}.disclosure-widget .dw-panel{margin-block-start:1rem}.disclosure-widget.no-js button{padding:0;display:flex;gap:.5rem;align-items:center;background:none;border:none;color:currentColor}.disclosure-widget.no-js button svg{width:1em;height:1em;transition:transform .2s linear}.disclosure-widget.no-js button[aria-expanded=true] svg{transform:rotate(90deg);transition:transform .2s linear}.disclosure-widget.no-js .panel{margin-block-start:1rem}div[tabindex="0"]{width:fit-content;margin-block:1rem;padding:2rem;background-color:#f8f8ff}div[tabindex="0"].colorme{background:linear-gradient(45deg,#b22222,#4682b4);font-weight:700;color:#fff}@keyframes arrow{0%{opacity:0;transform:translateY(2rem)}to{opacity:1;transform:translateY(0)}}@keyframes zoom{0%{opacity:0;transform:scale(.25)}to{opacity:1;transform:scale(1)}}@keyframes wave-hand{0%{transform:rotate(0)}20%{transform:rotate(15deg)}40%{transform:rotate(-15deg)}60%{transform:rotate(15deg)}80%{transform:rotate(-15deg)}to{transform:rotate(0)}}.modal-overlay{position:fixed;inset:0;opacity:0;z-index:-1;height:100dvh;display:grid;place-items:center;background-color:#333c;visibility:hidden;transition:opacity .5s ease-out,z-index 0s linear .5s visiblity 0s .5s}.modal-is-shown .modal-overlay{opacity:1;z-index:1;visibility:visible;transition-delay:0s}.modal-is-shown .modal-overlay svg.waving-hand{width:3rem;height:3rem;align-self:flex-end;stroke-width:1;transform-origin:bottom center;animation:zoom .5s ease-in,wave-hand 1.5s ease-in-out .5s}.modal{position:relative;display:flex;flex-direction:column;width:min(30rem,50%);padding:3rem;background-color:#fff}.modal .close{position:absolute;top:-1rem;right:-1rem;margin-block-start:unset;padding:unset;background-color:unset;border-radius:100vh}.modal .close svg{width:3rem;height:3rem;fill:#b22222;stroke:#fff}.modal-box{width:fit-content;display:flex;gap:.5rem;flex-direction:column;align-items:center}.modal-box button{display:block;transition:background-color .2s ease-out}.modal-box button:hover{background-color:salmon}.modal-box svg.arrow{width:2rem;height:2rem;stroke:#b22222;stroke-width:1.5;animation:arrow 1s cubic-bezier(.18,.89,.32,1.28)}.modal form .widget{margin-block:.5rem}.modal form label{display:block}.modal-dialog{width:min(30rem,100%);padding:1rem;background-color:#f8f8ff;box-shadow:0 1px 1px #03071205,0 5px 4px #03071208,0 12px 9px #0307120d,0 20px 15px #0307120f,0 32px 24px #03071214;border:none}.modal-dialog::backdrop{background:#000c}.svg-intro.grid{display:grid;gap:3rem;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr))}.svg-intro svg{background-color:#e6e6fa}.svg-intro .styled circle{stroke:#fa9;stroke-width:.75rem;stroke-dasharray:3,12;stroke-linecap:butt;fill:none}@keyframes casinoLights{0%{stroke-dashoffset:0}to{stroke-dashoffset:-15}}.svg-intro .styled:has(rect){background-color:#000}.svg-intro .styled:has(rect) rect{stroke:oklch(90% .3 164deg);stroke-width:5;stroke-dasharray:5px,10px;stroke-dashoffset:0;stroke-linecap:round;fill:none;animation:casinoLights .6s linear infinite}.tabby{width:min(35rem,100%)}.tabby .tab{position:relative;background-color:#b0c4de66;border:.5rem solid lightsteelblue;border-bottom:unset;color:currentColor;filter:grayscale(.75) brightness(.9)}.tabby .tab.is-selected{background-color:#fff;border-color:#b22222;filter:none}.tabby .tab.is-selected:after{position:absolute;z-index:1;bottom:-.5rem;left:0;right:0;display:block;content:"";border-bottom:.5rem solid white}.tabby .tab-content,.tabby .panel{display:none;padding:1rem;border:.5rem solid firebrick}.tabby .tab-content.is-selected,.tabby .panel.is-selected{display:block}.tabby .tab-content p,.tabby .tab-content li,.tabby .panel p,.tabby .panel li{width:fit-content}@layer reset,defaults,theme;