From ebec2a5821dc976861321f071eb7ad57338c6c89 Mon Sep 17 00:00:00 2001 From: Ehan Date: Wed, 4 Sep 2024 09:19:24 -0400 Subject: [PATCH] build changes to dropdowns, dropdown toggles, flex.compact-gap, and icononlybutton --- css/ehui-auto.css | 116 ++++++++++++++++++++++++++++++++++-- css/ehui-dark.css | 58 +++++++++++++++++- css/ehui-light.css | 58 +++++++++++++++++- site/css/ehui-auto.min.css | 4 +- site/css/ehui-dark.min.css | 2 +- site/css/ehui-light.min.css | 2 +- 6 files changed, 228 insertions(+), 12 deletions(-) diff --git a/css/ehui-auto.css b/css/ehui-auto.css index 292e58d..40bd05a 100644 --- a/css/ehui-auto.css +++ b/css/ehui-auto.css @@ -641,7 +641,9 @@ input[type=checkbox]:checked { } button.dropdown-toggle, -.button.dropdown-toggle { +.button.dropdown-toggle, +button.icon-only-button, +.button.icon-only-button { background-color: transparent; border: none; color: #343a40; @@ -650,7 +652,11 @@ button.dropdown-toggle, button.dropdown-toggle:hover, .button.dropdown-toggle:hover, button.dropdown-toggle:focus-visible, -.button.dropdown-toggle:focus-visible { +.button.dropdown-toggle:focus-visible, +button.icon-only-button:hover, +.button.icon-only-button:hover, +button.icon-only-button:focus-visible, +.button.icon-only-button:focus-visible { background-color: #EBEDF0; border: none; color: #6639BF; @@ -765,6 +771,10 @@ button.dropdown-toggle:focus-visible, justify-self: end; } +.flex.compact-gap { + gap: 0.2rem; +} + .grid { display: grid; } @@ -1535,6 +1545,50 @@ button.large, color: #008055; } +button.dropdown-toggle.ohno, +.button.dropdown-toggle.ohno, +button.icon-only-button.ohno, +.button.icon-only-button.ohno { + background-color: transparent; + border: none; + color: #E64545; +} + +button.dropdown-toggle.ohno:hover, +.button.dropdown-toggle.ohno:hover, +button.dropdown-toggle.ohno:focus-visible, +.button.dropdown-toggle.ohno:focus-visible, +button.icon-only-button.ohno:hover, +.button.icon-only-button.ohno:hover, +button.icon-only-button.ohno:focus-visible, +.button.icon-only-button.ohno:focus-visible { + background-color: #EBEDF0; + border: none; + color: #B33636; +} + +button.dropdown-toggle.yay, +.button.dropdown-toggle.yay, +button.icon-only-button.yay, +.button.icon-only-button.yay { + background-color: transparent; + border: none; + color: #00B377; +} + +button.dropdown-toggle.yay:hover, +.button.dropdown-toggle.yay:hover, +button.dropdown-toggle.yay:focus-visible, +.button.dropdown-toggle.yay:focus-visible, +button.icon-only-button.yay:hover, +.button.icon-only-button.yay:hover, +button.icon-only-button.yay:focus-visible, +.button.icon-only-button.yay:focus-visible { + background-color: #EBEDF0; + border: none; + color: #008055; +} + @media (prefers-reduced-motion) { html { scroll-behavior: auto; @@ -2241,7 +2295,9 @@ input[type=checkbox]:checked { } button.dropdown-toggle, -.button.dropdown-toggle { +.button.dropdown-toggle, +button.icon-only-button, +.button.icon-only-button { background-color: transparent; border: none; color: #c3cce9; @@ -2250,7 +2306,11 @@ button.dropdown-toggle, button.dropdown-toggle:hover, .button.dropdown-toggle:hover, button.dropdown-toggle:focus-visible, -.button.dropdown-toggle:focus-visible { +.button.dropdown-toggle:focus-visible, +button.icon-only-button:hover, +.button.icon-only-button:hover, +button.icon-only-button:focus-visible, +.button.icon-only-button:focus-visible { background-color: #2B2B3D; border: none; color: #B899FF; @@ -2365,6 +2425,10 @@ button.dropdown-toggle:focus-visible, justify-self: end; } +.flex.compact-gap { + gap: 0.2rem; +} + .grid { display: grid; } @@ -3135,6 +3199,50 @@ button.large, color: #CCFFEE; } +button.dropdown-toggle.ohno, +.button.dropdown-toggle.ohno, +button.icon-only-button.ohno, +.button.icon-only-button.ohno { + background-color: transparent; + border: none; + color: #ff6666; +} + +button.dropdown-toggle.ohno:hover, +.button.dropdown-toggle.ohno:hover, +button.dropdown-toggle.ohno:focus-visible, +.button.dropdown-toggle.ohno:focus-visible, +button.icon-only-button.ohno:hover, +.button.icon-only-button.ohno:hover, +button.icon-only-button.ohno:focus-visible, +.button.icon-only-button.ohno:focus-visible { + background-color: #2B2B3D; + border: none; + color: #ff9999; +} + +button.dropdown-toggle.yay, +.button.dropdown-toggle.yay, +button.icon-only-button.yay, +.button.icon-only-button.yay { + background-color: transparent; + border: none; + color: #66FFCC; +} + +button.dropdown-toggle.yay:hover, +.button.dropdown-toggle.yay:hover, +button.dropdown-toggle.yay:focus-visible, +.button.dropdown-toggle.yay:focus-visible, +button.icon-only-button.yay:hover, +.button.icon-only-button.yay:hover, +button.icon-only-button.yay:focus-visible, +.button.icon-only-button.yay:focus-visible { + background-color: #2B2B3D; + border: none; + color: #CCFFEE; +} + @media (prefers-reduced-motion) { html { scroll-behavior: auto; diff --git a/css/ehui-dark.css b/css/ehui-dark.css index ade7139..1ce9661 100644 --- a/css/ehui-dark.css +++ b/css/ehui-dark.css @@ -641,7 +641,9 @@ input[type=checkbox]:checked { } button.dropdown-toggle, -.button.dropdown-toggle { +.button.dropdown-toggle, +button.icon-only-button, +.button.icon-only-button { background-color: transparent; border: none; color: #c3cce9; @@ -650,7 +652,11 @@ button.dropdown-toggle, button.dropdown-toggle:hover, .button.dropdown-toggle:hover, button.dropdown-toggle:focus-visible, -.button.dropdown-toggle:focus-visible { +.button.dropdown-toggle:focus-visible, +button.icon-only-button:hover, +.button.icon-only-button:hover, +button.icon-only-button:focus-visible, +.button.icon-only-button:focus-visible { background-color: #2B2B3D; border: none; color: #B899FF; @@ -765,6 +771,10 @@ button.dropdown-toggle:focus-visible, justify-self: end; } +.flex.compact-gap { + gap: 0.2rem; +} + .grid { display: grid; } @@ -1535,6 +1545,50 @@ button.large, color: #CCFFEE; } +button.dropdown-toggle.ohno, +.button.dropdown-toggle.ohno, +button.icon-only-button.ohno, +.button.icon-only-button.ohno { + background-color: transparent; + border: none; + color: #ff6666; +} + +button.dropdown-toggle.ohno:hover, +.button.dropdown-toggle.ohno:hover, +button.dropdown-toggle.ohno:focus-visible, +.button.dropdown-toggle.ohno:focus-visible, +button.icon-only-button.ohno:hover, +.button.icon-only-button.ohno:hover, +button.icon-only-button.ohno:focus-visible, +.button.icon-only-button.ohno:focus-visible { + background-color: #2B2B3D; + border: none; + color: #ff9999; +} + +button.dropdown-toggle.yay, +.button.dropdown-toggle.yay, +button.icon-only-button.yay, +.button.icon-only-button.yay { + background-color: transparent; + border: none; + color: #66FFCC; +} + +button.dropdown-toggle.yay:hover, +.button.dropdown-toggle.yay:hover, +button.dropdown-toggle.yay:focus-visible, +.button.dropdown-toggle.yay:focus-visible, +button.icon-only-button.yay:hover, +.button.icon-only-button.yay:hover, +button.icon-only-button.yay:focus-visible, +.button.icon-only-button.yay:focus-visible { + background-color: #2B2B3D; + border: none; + color: #CCFFEE; +} + @media (prefers-reduced-motion) { html { scroll-behavior: auto; diff --git a/css/ehui-light.css b/css/ehui-light.css index 7a34b37..898ce4b 100644 --- a/css/ehui-light.css +++ b/css/ehui-light.css @@ -641,7 +641,9 @@ input[type=checkbox]:checked { } button.dropdown-toggle, -.button.dropdown-toggle { +.button.dropdown-toggle, +button.icon-only-button, +.button.icon-only-button { background-color: transparent; border: none; color: #343a40; @@ -650,7 +652,11 @@ button.dropdown-toggle, button.dropdown-toggle:hover, .button.dropdown-toggle:hover, button.dropdown-toggle:focus-visible, -.button.dropdown-toggle:focus-visible { +.button.dropdown-toggle:focus-visible, +button.icon-only-button:hover, +.button.icon-only-button:hover, +button.icon-only-button:focus-visible, +.button.icon-only-button:focus-visible { background-color: #EBEDF0; border: none; color: #6639BF; @@ -765,6 +771,10 @@ button.dropdown-toggle:focus-visible, justify-self: end; } +.flex.compact-gap { + gap: 0.2rem; +} + .grid { display: grid; } @@ -1535,6 +1545,50 @@ button.large, color: #008055; } +button.dropdown-toggle.ohno, +.button.dropdown-toggle.ohno, +button.icon-only-button.ohno, +.button.icon-only-button.ohno { + background-color: transparent; + border: none; + color: #E64545; +} + +button.dropdown-toggle.ohno:hover, +.button.dropdown-toggle.ohno:hover, +button.dropdown-toggle.ohno:focus-visible, +.button.dropdown-toggle.ohno:focus-visible, +button.icon-only-button.ohno:hover, +.button.icon-only-button.ohno:hover, +button.icon-only-button.ohno:focus-visible, +.button.icon-only-button.ohno:focus-visible { + background-color: #EBEDF0; + border: none; + color: #B33636; +} + +button.dropdown-toggle.yay, +.button.dropdown-toggle.yay, +button.icon-only-button.yay, +.button.icon-only-button.yay { + background-color: transparent; + border: none; + color: #00B377; +} + +button.dropdown-toggle.yay:hover, +.button.dropdown-toggle.yay:hover, +button.dropdown-toggle.yay:focus-visible, +.button.dropdown-toggle.yay:focus-visible, +button.icon-only-button.yay:hover, +.button.icon-only-button.yay:hover, +button.icon-only-button.yay:focus-visible, +.button.icon-only-button.yay:focus-visible { + background-color: #EBEDF0; + border: none; + color: #008055; +} + @media (prefers-reduced-motion) { html { scroll-behavior: auto; diff --git a/site/css/ehui-auto.min.css b/site/css/ehui-auto.min.css index b1b8059..47f122a 100644 --- a/site/css/ehui-auto.min.css +++ b/site/css/ehui-auto.min.css @@ -2,9 +2,9 @@ EhUI is free and open source Copyright (c) Ehan Ahamed and contributors https://ehan.dev/ehui/LICENSE.txt -*/:root{color-scheme:light}html{font-size:18px;height:auto;scroll-behavior:smooth}@media only screen and (max-width:800px){html{font-size:16px}}body{background-color:#fbfcfc;color:#343a40;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;height:auto;line-height:1.4;margin:0}::selection{background-color:#c499ff;color:#343a40}.h1,h1{font-size:3.4rem}.h1,.h2,h1,h2{font-weight:700;margin-bottom:1rem;margin-top:0}.h2,h2{font-size:2.8rem}.h3,h3{font-size:2.2rem}.h3,.h4,h3,h4{font-weight:700;margin-bottom:1rem;margin-top:0}.h4,h4{font-size:1.6rem}.h1,.h2,.h3,.h4,h1,h2,h3,h4{line-height:1.2}.h5,h5,p{font-size:1rem;font-weight:400;margin-bottom:1rem;margin-top:0}p{margin-block-end:0}.h6,h6,small{font-size:.8rem;font-weight:400;margin-bottom:1rem}.h5,.h6,h5,h6,p,small{line-height:1.4}.b,b{font-weight:700}.i,i{font-style:italic}i.nf{font-style:normal}.s,s{text-decoration:line-through}.mark,mark{background-color:#343a40;color:#fbfcfc}.code,.mark,code,mark{border-radius:.4rem;font-size:1rem;line-height:1.4;padding:.2rem .4rem}.code,code{font-family:monospace}.box,.code,code{background-color:#f0f2f5}.box{border:.2rem solid #f0f2f5;border-radius:.8rem;color:#343a40;padding:1rem}.hero{border-bottom:.2rem solid #e1e2e6;margin:4rem 1rem;padding:1rem 1rem 4rem;text-align:center}.topmost{margin:1rem}.header,header{background-color:#fbfcfc;border-bottom:.2rem solid #e1e2e6;height:4rem;margin:0 0 1rem;padding:0;position:static}.header.sticky,header.sticky{margin:0;position:sticky;top:0;z-index:100}header>.nav{align-items:center;display:flex;gap:1rem;margin:0 1rem}.nav>div{border-bottom:.2rem solid #fbfcfc}.nav>div.current{border-bottom:.2rem solid #6639bf}.nav>div.current>a{color:#6639bf}.footer,footer{border-top:.2rem solid #e1e2e6;margin:4rem 1rem;padding:4rem 1rem 1rem;text-align:center}table{border:.2rem solid #e1e2e6;border-collapse:separate;border-radius:.8rem;border-spacing:0}td{font-weight:400}td,th{padding:1rem;text-align:left}th{font-weight:700}table.outer tbody,table.outer td,table.outer tfoot,table.outer th,table.outer thead{border:none}table.inner td:not(:last-child),table.inner th:not(:last-child){border-right:.2rem solid #e1e2e6}table.inner>tbody:not(:last-child),table.inner>tbody>tr:not(:last-child)>td,table.inner>tbody>tr:not(:last-child)>th,table.inner>thead:not(:last-child),table.inner>thead>tr>td,table.inner>thead>tr>th,table.inner>tr:not(:last-child)>td,table.inner>tr:not(:last-child)>th{border-bottom:.2rem solid #e1e2e6}.a,a{border-radius:.4rem;color:#7c49f2;cursor:pointer;font-size:1rem;line-height:1.4;text-decoration:none;transition-duration:.4s}.a:focus-visible,.a:hover,a:focus-visible,a:hover{color:#6639bf}.a:focus-visible,a:focus-visible{outline:.2rem solid #7c49f2;outline-offset:.4rem;transition-duration:.1s}.button,button{align-items:flex-start;appearance:none;background-color:#7c49f2;border:.2rem solid #7c49f2;border-radius:2rem;box-sizing:border-box;color:#fbfcfc;cursor:pointer;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;font-weight:600;line-height:1.4;padding:.4rem .8rem;text-align:center;text-decoration:none;transition-duration:.4s}.button.alt,button.alt{background-color:#ebedf0;border-color:#ebedf0;color:#7c49f2}.button:focus-visible,.button:hover,button:focus-visible,button:hover{background-color:#6639bf;color:#fbfcfc}.button:focus-visible,button:focus-visible{outline:.2rem solid #7c49f2;outline-offset:.2rem;transition-duration:.1s}::placeholder{color:#868e96;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;opacity:1}input[type=password],input[type=text],textarea{align-items:flex-start;appearance:none;background-color:#fbfcfc;border:.2rem solid #e1e2e6;border-radius:.8rem;box-sizing:border-box;color:#343a40;cursor:text;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;line-height:1.4;outline:none;padding:.4rem .8rem;text-align:left;text-decoration:none;transition-duration:.4s}input[type=password]:hover,input[type=text]:hover,textarea:hover{border-color:#6639bf}input[type=password]:focus,input[type=password]:focus-visible,input[type=text]:focus,input[type=text]:focus-visible,textarea:focus,textarea:focus-visible{border-color:#7c49f2}.checkbox,.radio{display:grid;gap:1em;grid-template-areas:"input label .";grid-template-columns:1.8rem auto 1fr}.checkbox input,.radio input{grid-area:input}.checkbox label,.radio label{grid-area:label}input[type=checkbox],input[type=radio]{appearance:none;background-color:#fbfcfc;border:.2rem solid #7c49f2;height:1.8rem;margin:0;transition-duration:.4s;width:1.8rem}input[type=radio]{border-radius:50%}input[type=checkbox]{border-radius:.6rem}input[type=checkbox]:focus-visible,input[type=checkbox]:hover,input[type=radio]:focus-visible,input[type=radio]:hover{border-color:#6639bf}input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline:.2rem solid #7c49f2;outline-offset:.2rem;transition-duration:.1s}input[type=checkbox]:checked,input[type=radio]:checked{background-color:#7c49f2;transition-duration:.1s}.card{height:20rem;width:40rem}.caption{display:grid;gap:1rem;grid-template-rows:1fr;width:40rem}.caption.centerThree{grid-template-columns:1fr 4fr 1fr}.caption.evenTwo{grid-template-columns:1fr 1fr}.caption.evenThree{grid-template-columns:1fr 1fr 1fr}@media only screen and (max-width:800px){.caption,.card{width:100%}}.card>.content{align-items:center;background-color:#f0f2f5;border-radius:.8rem;display:flex;height:100%;justify-content:center;position:relative;text-align:center;width:100%}.card.double{perspective:1000px}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:preserve-3d;transition:transform .4s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;background-color:#f0f2f5;border-radius:.8rem;box-shadow:0 4px 10px 2px rgba(0,0,0,.1);display:flex;height:100%;justify-content:center;margin-top:0;position:absolute;text-align:center;transform:rotateX(0deg);width:100%}.card.double.flip>.content,.card.double>.content>.back{transform:rotateY(180deg)}.separator{align-items:center;color:#868e96;display:flex;justify-content:center}.separator:after,.separator:before{background:#e1e2e6;content:"";display:block;height:.2rem;margin:0 1rem;width:100%}.modal{align-items:center;display:flex;justify-content:center;z-index:200}.modal,.modal:before{height:100vh;left:0;position:fixed;top:0;width:100vw}.modal:before{background-color:#f0f2f5;content:"";opacity:.6;z-index:180}.modal>.content{background-color:#fbfcfc;border:.2rem solid #e1e2e6;border-radius:.8rem;padding:1rem;width:60vw;z-index:200}@media only screen and (max-width:800px){.modal{align-items:flex-end}.modal>.content{border:none;border-radius:0;border-top:.2rem solid #e1e2e6;padding-bottom:8rem;width:100vw}}.flex.pop{padding:0 1rem}.dropdown{display:inline-block;position:relative}.dropdown .content{align-items:stretch;background:#f0f2f5;border:.2rem solid #e1e2e6;border-radius:.8rem;display:none;flex-direction:column;gap:.4rem;margin-top:.4rem;padding:.4rem;position:absolute;z-index:1}.dropdown:focus-within .content{display:flex}.dropdown .content .button,.dropdown .content button{background-color:#f0f2f5;border-color:#f0f2f5;color:#7c49f2;margin-top:0;text-wrap:nowrap}.dropdown .content .button:focus-visible,.dropdown .content .button:hover,.dropdown .content button:focus-visible,.dropdown .content button:hover{background-color:#ebedf0;border-color:#ebedf0;color:#6639bf}.button.dropdown-toggle,button.dropdown-toggle{background-color:transparent;border:none;color:#343a40}.button.dropdown-toggle:focus-visible,.button.dropdown-toggle:hover,button.dropdown-toggle:focus-visible,button.dropdown-toggle:hover{background-color:#ebedf0;border:none;color:#6639bf}*,:after,:before{box-sizing:border-box}.center{text-align:center}.flex{display:flex;flex-wrap:wrap;gap:1rem}.flex.row{flex-direction:row}.flex.row.rev{flex-direction:row-reverse}.flex.col{flex-direction:column}.flex.col.rev{flex-direction:column-reverse}.flex.no-wrap,.flex.nowrap{flex-wrap:nowrap}.flex.wrap{flex-wrap:wrap}.flex.start{justify-content:flex-start}.flex.end{justify-content:flex-end}.flex.center{justify-content:center}.flex.spaceBetween{justify-content:space-between}.flex.alignStart{align-content:flex-start;align-items:flex-start}.flex.alignEnd{align-content:flex-end;align-items:flex-end}.flex.alignCenter,.flex.center-v{align-content:center;align-items:center}.flex.center-h{justify-content:center;justify-items:center}.flex.stretch{align-content:stretch;align-items:stretch}.flex.alignSpaceBetween{align-content:space-between;align-items:space-between}.flex.alignSpaceAround{align-content:space-around;align-items:space-around}.justifyselfstretch{justify-self:stretch}.justifyselfcenter{justify-self:center}.justifyselfstart{justify-self:start}.justifyselfend{justify-self:end}.grid{display:grid}.grid.split{gap:0;grid-template-areas:"left right";grid-template-columns:4fr 4fr;grid-template-rows:1fr}.grid.split>.left{grid-area:left;justify-self:right;padding-right:2rem}.grid.split>.right{border-left:.2rem solid #e1e2e6;grid-area:right;justify-self:left;padding-left:2rem}.grid.split.noBorder>.left,.grid.split.noBorder>.right{border:none}@media only screen and (max-width:800px){.grid.split{grid-template-areas:"left" "right";grid-template-columns:1fr;grid-template-rows:auto auto;padding:0 2rem}.grid.split>.left,.grid.split>.right{border:none;justify-self:left;padding-left:0;padding-right:0}}.grid.list{gap:1rem;grid-template-columns:1fr 1fr 1fr;margin-bottom:2rem}.grid.split .grid.list{grid-template-columns:1fr}@media only screen and (max-width:800px){.grid.list{grid-template-columns:1fr}}.grid.hero{grid-template-areas:"content . logo";grid-template-columns:6fr 2fr 6fr;grid-template-rows:1fr}.grid.hero>.content{align-self:center;grid-area:content;justify-self:end;text-align:center}.grid.hero>.logo{align-self:center;grid-area:logo;justify-self:start}@media only screen and (max-width:800px){.grid.hero{grid-template-areas:"logo" "content";grid-template-columns:1fr;grid-template-rows:1fr 1fr}.grid.hero>.content,.grid.hero>.logo{justify-self:center}}.grid.intro{border-bottom:.2rem solid #e1e2e6;gap:4rem;grid-template-areas:"logotype actions" "content content";grid-template-columns:1fr 1fr;grid-template-rows:auto auto;margin:0 1rem 4rem;padding:1rem 2rem 4rem}.grid.intro>.logotype{align-items:center;display:flex;gap:1rem;grid-area:logotype;justify-content:start;justify-items:start}.grid.intro>.logotype p{margin-bottom:0}.grid.intro>.logotype>.logo{height:4rem;width:4rem}.grid.intro>.content{grid-area:content;text-align:center}@media only screen and (max-width:800px){.grid.intro{padding-left:1rem;padding-right:1rem}}.grid.page{grid-template-areas:". content .";grid-template-columns:2fr 10fr 2fr;grid-template-rows:1fr}.grid.page>.content{align-self:start;grid-area:content;justify-self:stretch}@media only screen and (max-width:800px){.grid.page{grid-template-columns:1fr 12fr 1fr}}.grid.screen{height:100%;margin:0 1rem}.grid.screen>.content{align-self:center;justify-self:center;margin-top:0}html.screen{height:100%}html.screen body{display:grid;grid-template-rows:auto 1fr;height:100%}header{display:grid;gap:1rem;grid-template-areas:"menu";grid-template-columns:1fr}header>.menu{grid-area:menu;justify-self:left;text-align:left}header>.options{grid-area:options;justify-self:right;padding:1rem;text-align:right}.nav>div{align-items:center;display:flex;height:100%}*+*,*+h1,*+h2,*+h3,*+h4,*+h5,*+h6,*+p{margin-top:1rem}.caption>*,.caption>div>*,.checkbox>*,.flex>*,.grid>*,.logotype>*,.nav>div,.radio>*,header>*{margin-top:0}.grid.paragraph{gap:1rem;grid-template-areas:"content image";grid-template-columns:1fr 1fr}.grid.paragraph.alt{grid-template-areas:"image content"}.grid.paragraph>.content{grid-area:content}.grid.paragraph>.image{align-items:center;display:flex;grid-area:image;justify-items:center}@media only screen and (max-width:1000px){.grid.paragraph,.grid.paragraph.alt{gap:1rem;grid-template-areas:"content" "image";grid-template-columns:1fr;grid-template-rows:1fr auto}}a.mark{color:#7c49f2}a.mark:focus-visible,a.mark:hover{color:#6639bf}.mark.ohno,.text.ohno,b.ohno,code.ohno,i.ohno,mark.ohno,p.ohno,span.ohno,u.ohno{color:#e64545}.mark.yay,.text.yay,b.yay,code.yay,i.yay,mark.yay,p.yay,span.yay,u.yay{color:#00b377}.mark.bg1,.text.bg1,b.bg1,code.bg1,i.bg1,mark.bg1,p.bg1,span.bg1,u.bg1{color:#fbfcfc}.mark.fg1,.mark.fg2,.text.fg1,.text.fg2,b.fg1,b.fg2,code.fg1,code.fg2,i.fg1,i.fg2,mark.fg1,mark.fg2,p.fg1,p.fg2,span.fg1,span.fg2,u.fg1,u.fg2{color:#343a40}.mark.fg0,.text.fg0,b.fg0,code.fg0,i.fg0,mark.fg0,p.fg0,span.fg0,u.fg0{color:#868e96}.mark.main,.text.main,b.main,code.main,i.main,mark.main,p.main,span.main,u.main{color:#7c49f2}.mark.extra,.text.extra,b.extra,code.extra,i.extra,mark.extra,p.extra,span.extra,u.extra{color:#00b377}.mark.markOhno,mark.markOhno{background-color:#e64545}.mark.markYay,mark.markYay{background-color:#00b377}.mark.markBg4,mark.markBg4{background-color:#e1e2e6}.mark.markBg2,mark.markBg2{background-color:#f0f2f5}.mark.markFg1,.mark.markFg2,mark.markFg1,mark.markFg2{background-color:#343a40}.mark.markFg0,mark.markFg0{background-color:#868e96}.mark.markMain,mark.markMain{background-color:#7c49f2}.mark.markExtra,mark.markExtra{background-color:#00b377}.box.ohno{border-color:#e64545;color:#e64545}.box.yay{border-color:#00b377;color:#00b377}.pre,pre{white-space:pre}.button.ohno,button.ohno{background-color:#e64545;border-color:#e64545}.button.extra,.button.yay,button.extra,button.yay{background-color:#00b377;border-color:#00b377}.button.extra,button.extra{color:#f0f2f5}.button.alt.ohno,button.alt.ohno{background-color:#ebedf0;border-color:#ebedf0;color:#e64545}.button.alt.extra,.button.alt.yay,button.alt.extra,button.alt.yay{background-color:#ebedf0;border-color:#ebedf0;color:#00b377}.button:focus-visible.ohno,.button:hover.ohno,button:focus-visible.ohno,button:hover.ohno{background-color:#b33636;color:#fbfcfc}.button:focus-visible.yay,.button:hover.yay,button:focus-visible.yay,button:hover.yay{background-color:#008055;color:#fbfcfc}.button:focus-visible.extra,.button:hover.extra,button:focus-visible.extra,button:hover.extra{background-color:#008055;color:#f0f2f5}.button:focus-visible.ohno,button:focus-visible.ohno{outline-color:#e64545}.button:focus-visible.yay,button:focus-visible.yay{outline-color:#00b377}.button:focus-visible.extra,button:focus-visible.extra{outline-color:#00b377}input[type=password].ohno:hover,input[type=text].ohno:hover,textarea.ohno:hover{border-color:#b33636}input[type=password].extra:hover,input[type=password].yay:hover,input[type=text].extra:hover,input[type=text].yay:hover,textarea.extra:hover,textarea.yay:hover{border-color:#008055}input[type=password].ohno:focus,input[type=password].ohno:focus-visible,input[type=text].ohno:focus,input[type=text].ohno:focus-visible,textarea.ohno:focus,textarea.ohno:focus-visible{border-color:#e64545}input[type=password].yay:focus,input[type=password].yay:focus-visible,input[type=text].yay:focus,input[type=text].yay:focus-visible,textarea.yay:focus,textarea.yay:focus-visible{border-color:#00b377}input[type=password].extra:focus,input[type=password].extra:focus-visible,input[type=text].extra:focus,input[type=text].extra:focus-visible,textarea.extra:focus,textarea.extra:focus-visible{border-color:#00b377}textarea.vertical{resize:vertical;white-space:pre}textarea.horizontal{resize:horizontal;white-space:pre}.hide{display:none}.fullscreen{align-items:center;background:#fbfcfc;display:flex;height:100vh;justify-content:center;left:0;margin:0;position:fixed;top:0;width:100vw;z-index:200}.exitFullscreen{display:none;left:1rem;margin:0;position:fixed;top:1rem}.fullscreen>.button.exitFullscreen,.fullscreen>button.exitFullscreen{display:inline-block}.invisible{height:1px;margin:0;opacity:0;overflow:hidden;position:absolute;width:1px}.hero>.logo:before{background-color:#7c49f2;border-radius:50%;content:"";filter:blur(1rem);height:200px;opacity:.2;position:absolute;width:200px;z-index:-100}html.min .hero>.logo:before{display:none}.hero>.logo>svg{margin-top:0}.fullWidth{width:100%}.grid.page.extra{background-color:#f0f2f5;margin-bottom:0;margin-top:0;padding-bottom:1rem}.button.large,button.large{font-size:1.2rem;line-height:1.6rem;padding:.6rem 1.2rem}.fill-ohno{fill:#e64545}.fill-ohno-alt{fill:#b33636}.fill-yay{fill:#00b377}.fill-yay-alt{fill:#008055}.fill-main{fill:#7c49f2}.fill-main-alt{fill:#6639bf}.fill-extra{fill:#00b377}.fill-extra-alt{fill:#008055}.fill-extra-bg{fill:#f0f2f5}.fill-fg1,.fill-fg2{fill:#343a40}.fill-fg0{fill:#868e96}.fill-bg4{fill:#e1e2e6}.fill-bg3{fill:#ebedf0}.fill-bg2{fill:#f0f2f5}.fill-bg1{fill:#fbfcfc}.fill-bg0{fill:#f0f2f5}.background-bg2,.background-extra-bg{background-color:#f0f2f5}.background-bg1{background-color:#fbfcfc}.background-bg0{background-color:#f0f2f5}.dropdown .content .button.ohno,.dropdown .content button.ohno{background-color:#f0f2f5;border-color:#f0f2f5;color:#e64545}.dropdown .content .button.yay,.dropdown .content button.yay{background-color:#f0f2f5;border-color:#f0f2f5;color:#00b377}.dropdown .content .button.ohno:focus-visible,.dropdown .content .button.ohno:hover,.dropdown .content button.ohno:focus-visible,.dropdown .content button.ohno:hover{background-color:#ebedf0;border-color:#ebedf0;color:#b33636}.dropdown .content .button.yay:focus-visible,.dropdown .content .button.yay:hover,.dropdown .content button.yay:focus-visible,.dropdown .content button.yay:hover{background-color:#ebedf0;border-color:#ebedf0;color:#008055}@media (prefers-reduced-motion){html{scroll-behavior:auto}.a,.button,a,button,input[type=checkbox],input[type=password],input[type=radio],input[type=text],textarea{transition-duration:0s}.card,.card.double{perspective:none}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:flat;transition-duration:0s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:visible;-webkit-backface-visibility:visible;-moz-backface-visibility:visible;background-color:#f0f2f5;border-radius:.8rem;height:100%;justify-content:center;position:absolute;text-align:center;transform:none;width:100%}.card.double>.content>.back{display:none;transform:none}.card.double>.content>.front{display:flex}.card.double.flip>.content{transform:none}.card.double.flip>.content>.back{display:flex}.card.double.flip>.content>.front{display:none}}@media (prefers-color-scheme:dark){ +*/:root{color-scheme:light}html{font-size:18px;height:auto;scroll-behavior:smooth}@media only screen and (max-width:800px){html{font-size:16px}}body{background-color:#fbfcfc;color:#343a40;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;height:auto;line-height:1.4;margin:0}::selection{background-color:#c499ff;color:#343a40}.h1,h1{font-size:3.4rem}.h1,.h2,h1,h2{font-weight:700;margin-bottom:1rem;margin-top:0}.h2,h2{font-size:2.8rem}.h3,h3{font-size:2.2rem}.h3,.h4,h3,h4{font-weight:700;margin-bottom:1rem;margin-top:0}.h4,h4{font-size:1.6rem}.h1,.h2,.h3,.h4,h1,h2,h3,h4{line-height:1.2}.h5,h5,p{font-size:1rem;font-weight:400;margin-bottom:1rem;margin-top:0}p{margin-block-end:0}.h6,h6,small{font-size:.8rem;font-weight:400;margin-bottom:1rem}.h5,.h6,h5,h6,p,small{line-height:1.4}.b,b{font-weight:700}.i,i{font-style:italic}i.nf{font-style:normal}.s,s{text-decoration:line-through}.mark,mark{background-color:#343a40;color:#fbfcfc}.code,.mark,code,mark{border-radius:.4rem;font-size:1rem;line-height:1.4;padding:.2rem .4rem}.code,code{font-family:monospace}.box,.code,code{background-color:#f0f2f5}.box{border:.2rem solid #f0f2f5;border-radius:.8rem;color:#343a40;padding:1rem}.hero{border-bottom:.2rem solid #e1e2e6;margin:4rem 1rem;padding:1rem 1rem 4rem;text-align:center}.topmost{margin:1rem}.header,header{background-color:#fbfcfc;border-bottom:.2rem solid #e1e2e6;height:4rem;margin:0 0 1rem;padding:0;position:static}.header.sticky,header.sticky{margin:0;position:sticky;top:0;z-index:100}header>.nav{align-items:center;display:flex;gap:1rem;margin:0 1rem}.nav>div{border-bottom:.2rem solid #fbfcfc}.nav>div.current{border-bottom:.2rem solid #6639bf}.nav>div.current>a{color:#6639bf}.footer,footer{border-top:.2rem solid #e1e2e6;margin:4rem 1rem;padding:4rem 1rem 1rem;text-align:center}table{border:.2rem solid #e1e2e6;border-collapse:separate;border-radius:.8rem;border-spacing:0}td{font-weight:400}td,th{padding:1rem;text-align:left}th{font-weight:700}table.outer tbody,table.outer td,table.outer tfoot,table.outer th,table.outer thead{border:none}table.inner td:not(:last-child),table.inner th:not(:last-child){border-right:.2rem solid #e1e2e6}table.inner>tbody:not(:last-child),table.inner>tbody>tr:not(:last-child)>td,table.inner>tbody>tr:not(:last-child)>th,table.inner>thead:not(:last-child),table.inner>thead>tr>td,table.inner>thead>tr>th,table.inner>tr:not(:last-child)>td,table.inner>tr:not(:last-child)>th{border-bottom:.2rem solid #e1e2e6}.a,a{border-radius:.4rem;color:#7c49f2;cursor:pointer;font-size:1rem;line-height:1.4;text-decoration:none;transition-duration:.4s}.a:focus-visible,.a:hover,a:focus-visible,a:hover{color:#6639bf}.a:focus-visible,a:focus-visible{outline:.2rem solid #7c49f2;outline-offset:.4rem;transition-duration:.1s}.button,button{align-items:flex-start;appearance:none;background-color:#7c49f2;border:.2rem solid #7c49f2;border-radius:2rem;box-sizing:border-box;color:#fbfcfc;cursor:pointer;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;font-weight:600;line-height:1.4;padding:.4rem .8rem;text-align:center;text-decoration:none;transition-duration:.4s}.button.alt,button.alt{background-color:#ebedf0;border-color:#ebedf0;color:#7c49f2}.button:focus-visible,.button:hover,button:focus-visible,button:hover{background-color:#6639bf;color:#fbfcfc}.button:focus-visible,button:focus-visible{outline:.2rem solid #7c49f2;outline-offset:.2rem;transition-duration:.1s}::placeholder{color:#868e96;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;opacity:1}input[type=password],input[type=text],textarea{align-items:flex-start;appearance:none;background-color:#fbfcfc;border:.2rem solid #e1e2e6;border-radius:.8rem;box-sizing:border-box;color:#343a40;cursor:text;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;line-height:1.4;outline:none;padding:.4rem .8rem;text-align:left;text-decoration:none;transition-duration:.4s}input[type=password]:hover,input[type=text]:hover,textarea:hover{border-color:#6639bf}input[type=password]:focus,input[type=password]:focus-visible,input[type=text]:focus,input[type=text]:focus-visible,textarea:focus,textarea:focus-visible{border-color:#7c49f2}.checkbox,.radio{display:grid;gap:1em;grid-template-areas:"input label .";grid-template-columns:1.8rem auto 1fr}.checkbox input,.radio input{grid-area:input}.checkbox label,.radio label{grid-area:label}input[type=checkbox],input[type=radio]{appearance:none;background-color:#fbfcfc;border:.2rem solid #7c49f2;height:1.8rem;margin:0;transition-duration:.4s;width:1.8rem}input[type=radio]{border-radius:50%}input[type=checkbox]{border-radius:.6rem}input[type=checkbox]:focus-visible,input[type=checkbox]:hover,input[type=radio]:focus-visible,input[type=radio]:hover{border-color:#6639bf}input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline:.2rem solid #7c49f2;outline-offset:.2rem;transition-duration:.1s}input[type=checkbox]:checked,input[type=radio]:checked{background-color:#7c49f2;transition-duration:.1s}.card{height:20rem;width:40rem}.caption{display:grid;gap:1rem;grid-template-rows:1fr;width:40rem}.caption.centerThree{grid-template-columns:1fr 4fr 1fr}.caption.evenTwo{grid-template-columns:1fr 1fr}.caption.evenThree{grid-template-columns:1fr 1fr 1fr}@media only screen and (max-width:800px){.caption,.card{width:100%}}.card>.content{align-items:center;background-color:#f0f2f5;border-radius:.8rem;display:flex;height:100%;justify-content:center;position:relative;text-align:center;width:100%}.card.double{perspective:1000px}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:preserve-3d;transition:transform .4s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;background-color:#f0f2f5;border-radius:.8rem;box-shadow:0 4px 10px 2px rgba(0,0,0,.1);display:flex;height:100%;justify-content:center;margin-top:0;position:absolute;text-align:center;transform:rotateX(0deg);width:100%}.card.double.flip>.content,.card.double>.content>.back{transform:rotateY(180deg)}.separator{align-items:center;color:#868e96;display:flex;justify-content:center}.separator:after,.separator:before{background:#e1e2e6;content:"";display:block;height:.2rem;margin:0 1rem;width:100%}.modal{align-items:center;display:flex;justify-content:center;z-index:200}.modal,.modal:before{height:100vh;left:0;position:fixed;top:0;width:100vw}.modal:before{background-color:#f0f2f5;content:"";opacity:.6;z-index:180}.modal>.content{background-color:#fbfcfc;border:.2rem solid #e1e2e6;border-radius:.8rem;padding:1rem;width:60vw;z-index:200}@media only screen and (max-width:800px){.modal{align-items:flex-end}.modal>.content{border:none;border-radius:0;border-top:.2rem solid #e1e2e6;padding-bottom:8rem;width:100vw}}.flex.pop{padding:0 1rem}.dropdown{display:inline-block;position:relative}.dropdown .content{align-items:stretch;background:#f0f2f5;border:.2rem solid #e1e2e6;border-radius:.8rem;display:none;flex-direction:column;gap:.4rem;margin-top:.4rem;padding:.4rem;position:absolute;z-index:1}.dropdown:focus-within .content{display:flex}.dropdown .content .button,.dropdown .content button{background-color:#f0f2f5;border-color:#f0f2f5;color:#7c49f2;margin-top:0;text-wrap:nowrap}.dropdown .content .button:focus-visible,.dropdown .content .button:hover,.dropdown .content button:focus-visible,.dropdown .content button:hover{background-color:#ebedf0;border-color:#ebedf0;color:#6639bf}.button.dropdown-toggle,.button.icon-only-button,button.dropdown-toggle,button.icon-only-button{background-color:transparent;border:none;color:#343a40}.button.dropdown-toggle:focus-visible,.button.dropdown-toggle:hover,.button.icon-only-button:focus-visible,.button.icon-only-button:hover,button.dropdown-toggle:focus-visible,button.dropdown-toggle:hover,button.icon-only-button:focus-visible,button.icon-only-button:hover{background-color:#ebedf0;border:none;color:#6639bf}*,:after,:before{box-sizing:border-box}.center{text-align:center}.flex{display:flex;flex-wrap:wrap;gap:1rem}.flex.row{flex-direction:row}.flex.row.rev{flex-direction:row-reverse}.flex.col{flex-direction:column}.flex.col.rev{flex-direction:column-reverse}.flex.no-wrap,.flex.nowrap{flex-wrap:nowrap}.flex.wrap{flex-wrap:wrap}.flex.start{justify-content:flex-start}.flex.end{justify-content:flex-end}.flex.center{justify-content:center}.flex.spaceBetween{justify-content:space-between}.flex.alignStart{align-content:flex-start;align-items:flex-start}.flex.alignEnd{align-content:flex-end;align-items:flex-end}.flex.alignCenter,.flex.center-v{align-content:center;align-items:center}.flex.center-h{justify-content:center;justify-items:center}.flex.stretch{align-content:stretch;align-items:stretch}.flex.alignSpaceBetween{align-content:space-between;align-items:space-between}.flex.alignSpaceAround{align-content:space-around;align-items:space-around}.justifyselfstretch{justify-self:stretch}.justifyselfcenter{justify-self:center}.justifyselfstart{justify-self:start}.justifyselfend{justify-self:end}.flex.compact-gap{gap:.2rem}.grid{display:grid}.grid.split{gap:0;grid-template-areas:"left right";grid-template-columns:4fr 4fr;grid-template-rows:1fr}.grid.split>.left{grid-area:left;justify-self:right;padding-right:2rem}.grid.split>.right{border-left:.2rem solid #e1e2e6;grid-area:right;justify-self:left;padding-left:2rem}.grid.split.noBorder>.left,.grid.split.noBorder>.right{border:none}@media only screen and (max-width:800px){.grid.split{grid-template-areas:"left" "right";grid-template-columns:1fr;grid-template-rows:auto auto;padding:0 2rem}.grid.split>.left,.grid.split>.right{border:none;justify-self:left;padding-left:0;padding-right:0}}.grid.list{gap:1rem;grid-template-columns:1fr 1fr 1fr;margin-bottom:2rem}.grid.split .grid.list{grid-template-columns:1fr}@media only screen and (max-width:800px){.grid.list{grid-template-columns:1fr}}.grid.hero{grid-template-areas:"content . logo";grid-template-columns:6fr 2fr 6fr;grid-template-rows:1fr}.grid.hero>.content{align-self:center;grid-area:content;justify-self:end;text-align:center}.grid.hero>.logo{align-self:center;grid-area:logo;justify-self:start}@media only screen and (max-width:800px){.grid.hero{grid-template-areas:"logo" "content";grid-template-columns:1fr;grid-template-rows:1fr 1fr}.grid.hero>.content,.grid.hero>.logo{justify-self:center}}.grid.intro{border-bottom:.2rem solid #e1e2e6;gap:4rem;grid-template-areas:"logotype actions" "content content";grid-template-columns:1fr 1fr;grid-template-rows:auto auto;margin:0 1rem 4rem;padding:1rem 2rem 4rem}.grid.intro>.logotype{align-items:center;display:flex;gap:1rem;grid-area:logotype;justify-content:start;justify-items:start}.grid.intro>.logotype p{margin-bottom:0}.grid.intro>.logotype>.logo{height:4rem;width:4rem}.grid.intro>.content{grid-area:content;text-align:center}@media only screen and (max-width:800px){.grid.intro{padding-left:1rem;padding-right:1rem}}.grid.page{grid-template-areas:". content .";grid-template-columns:2fr 10fr 2fr;grid-template-rows:1fr}.grid.page>.content{align-self:start;grid-area:content;justify-self:stretch}@media only screen and (max-width:800px){.grid.page{grid-template-columns:1fr 12fr 1fr}}.grid.screen{height:100%;margin:0 1rem}.grid.screen>.content{align-self:center;justify-self:center;margin-top:0}html.screen{height:100%}html.screen body{display:grid;grid-template-rows:auto 1fr;height:100%}header{display:grid;gap:1rem;grid-template-areas:"menu";grid-template-columns:1fr}header>.menu{grid-area:menu;justify-self:left;text-align:left}header>.options{grid-area:options;justify-self:right;padding:1rem;text-align:right}.nav>div{align-items:center;display:flex;height:100%}*+*,*+h1,*+h2,*+h3,*+h4,*+h5,*+h6,*+p{margin-top:1rem}.caption>*,.caption>div>*,.checkbox>*,.flex>*,.grid>*,.logotype>*,.nav>div,.radio>*,header>*{margin-top:0}.grid.paragraph{gap:1rem;grid-template-areas:"content image";grid-template-columns:1fr 1fr}.grid.paragraph.alt{grid-template-areas:"image content"}.grid.paragraph>.content{grid-area:content}.grid.paragraph>.image{align-items:center;display:flex;grid-area:image;justify-items:center}@media only screen and (max-width:1000px){.grid.paragraph,.grid.paragraph.alt{gap:1rem;grid-template-areas:"content" "image";grid-template-columns:1fr;grid-template-rows:1fr auto}}a.mark{color:#7c49f2}a.mark:focus-visible,a.mark:hover{color:#6639bf}.mark.ohno,.text.ohno,b.ohno,code.ohno,i.ohno,mark.ohno,p.ohno,span.ohno,u.ohno{color:#e64545}.mark.yay,.text.yay,b.yay,code.yay,i.yay,mark.yay,p.yay,span.yay,u.yay{color:#00b377}.mark.bg1,.text.bg1,b.bg1,code.bg1,i.bg1,mark.bg1,p.bg1,span.bg1,u.bg1{color:#fbfcfc}.mark.fg1,.mark.fg2,.text.fg1,.text.fg2,b.fg1,b.fg2,code.fg1,code.fg2,i.fg1,i.fg2,mark.fg1,mark.fg2,p.fg1,p.fg2,span.fg1,span.fg2,u.fg1,u.fg2{color:#343a40}.mark.fg0,.text.fg0,b.fg0,code.fg0,i.fg0,mark.fg0,p.fg0,span.fg0,u.fg0{color:#868e96}.mark.main,.text.main,b.main,code.main,i.main,mark.main,p.main,span.main,u.main{color:#7c49f2}.mark.extra,.text.extra,b.extra,code.extra,i.extra,mark.extra,p.extra,span.extra,u.extra{color:#00b377}.mark.markOhno,mark.markOhno{background-color:#e64545}.mark.markYay,mark.markYay{background-color:#00b377}.mark.markBg4,mark.markBg4{background-color:#e1e2e6}.mark.markBg2,mark.markBg2{background-color:#f0f2f5}.mark.markFg1,.mark.markFg2,mark.markFg1,mark.markFg2{background-color:#343a40}.mark.markFg0,mark.markFg0{background-color:#868e96}.mark.markMain,mark.markMain{background-color:#7c49f2}.mark.markExtra,mark.markExtra{background-color:#00b377}.box.ohno{border-color:#e64545;color:#e64545}.box.yay{border-color:#00b377;color:#00b377}.pre,pre{white-space:pre}.button.ohno,button.ohno{background-color:#e64545;border-color:#e64545}.button.extra,.button.yay,button.extra,button.yay{background-color:#00b377;border-color:#00b377}.button.extra,button.extra{color:#f0f2f5}.button.alt.ohno,button.alt.ohno{background-color:#ebedf0;border-color:#ebedf0;color:#e64545}.button.alt.extra,.button.alt.yay,button.alt.extra,button.alt.yay{background-color:#ebedf0;border-color:#ebedf0;color:#00b377}.button:focus-visible.ohno,.button:hover.ohno,button:focus-visible.ohno,button:hover.ohno{background-color:#b33636;color:#fbfcfc}.button:focus-visible.yay,.button:hover.yay,button:focus-visible.yay,button:hover.yay{background-color:#008055;color:#fbfcfc}.button:focus-visible.extra,.button:hover.extra,button:focus-visible.extra,button:hover.extra{background-color:#008055;color:#f0f2f5}.button:focus-visible.ohno,button:focus-visible.ohno{outline-color:#e64545}.button:focus-visible.yay,button:focus-visible.yay{outline-color:#00b377}.button:focus-visible.extra,button:focus-visible.extra{outline-color:#00b377}input[type=password].ohno:hover,input[type=text].ohno:hover,textarea.ohno:hover{border-color:#b33636}input[type=password].extra:hover,input[type=password].yay:hover,input[type=text].extra:hover,input[type=text].yay:hover,textarea.extra:hover,textarea.yay:hover{border-color:#008055}input[type=password].ohno:focus,input[type=password].ohno:focus-visible,input[type=text].ohno:focus,input[type=text].ohno:focus-visible,textarea.ohno:focus,textarea.ohno:focus-visible{border-color:#e64545}input[type=password].yay:focus,input[type=password].yay:focus-visible,input[type=text].yay:focus,input[type=text].yay:focus-visible,textarea.yay:focus,textarea.yay:focus-visible{border-color:#00b377}input[type=password].extra:focus,input[type=password].extra:focus-visible,input[type=text].extra:focus,input[type=text].extra:focus-visible,textarea.extra:focus,textarea.extra:focus-visible{border-color:#00b377}textarea.vertical{resize:vertical;white-space:pre}textarea.horizontal{resize:horizontal;white-space:pre}.hide{display:none}.fullscreen{align-items:center;background:#fbfcfc;display:flex;height:100vh;justify-content:center;left:0;margin:0;position:fixed;top:0;width:100vw;z-index:200}.exitFullscreen{display:none;left:1rem;margin:0;position:fixed;top:1rem}.fullscreen>.button.exitFullscreen,.fullscreen>button.exitFullscreen{display:inline-block}.invisible{height:1px;margin:0;opacity:0;overflow:hidden;position:absolute;width:1px}.hero>.logo:before{background-color:#7c49f2;border-radius:50%;content:"";filter:blur(1rem);height:200px;opacity:.2;position:absolute;width:200px;z-index:-100}html.min .hero>.logo:before{display:none}.hero>.logo>svg{margin-top:0}.fullWidth{width:100%}.grid.page.extra{background-color:#f0f2f5;margin-bottom:0;margin-top:0;padding-bottom:1rem}.button.large,button.large{font-size:1.2rem;line-height:1.6rem;padding:.6rem 1.2rem}.fill-ohno{fill:#e64545}.fill-ohno-alt{fill:#b33636}.fill-yay{fill:#00b377}.fill-yay-alt{fill:#008055}.fill-main{fill:#7c49f2}.fill-main-alt{fill:#6639bf}.fill-extra{fill:#00b377}.fill-extra-alt{fill:#008055}.fill-extra-bg{fill:#f0f2f5}.fill-fg1,.fill-fg2{fill:#343a40}.fill-fg0{fill:#868e96}.fill-bg4{fill:#e1e2e6}.fill-bg3{fill:#ebedf0}.fill-bg2{fill:#f0f2f5}.fill-bg1{fill:#fbfcfc}.fill-bg0{fill:#f0f2f5}.background-bg2,.background-extra-bg{background-color:#f0f2f5}.background-bg1{background-color:#fbfcfc}.background-bg0{background-color:#f0f2f5}.dropdown .content .button.ohno,.dropdown .content button.ohno{background-color:#f0f2f5;border-color:#f0f2f5;color:#e64545}.dropdown .content .button.yay,.dropdown .content button.yay{background-color:#f0f2f5;border-color:#f0f2f5;color:#00b377}.dropdown .content .button.ohno:focus-visible,.dropdown .content .button.ohno:hover,.dropdown .content button.ohno:focus-visible,.dropdown .content button.ohno:hover{background-color:#ebedf0;border-color:#ebedf0;color:#b33636}.dropdown .content .button.yay:focus-visible,.dropdown .content .button.yay:hover,.dropdown .content button.yay:focus-visible,.dropdown .content button.yay:hover{background-color:#ebedf0;border-color:#ebedf0;color:#008055}.button.dropdown-toggle.ohno,.button.icon-only-button.ohno,button.dropdown-toggle.ohno,button.icon-only-button.ohno{background-color:transparent;border:none;color:#e64545}.button.dropdown-toggle.ohno:focus-visible,.button.dropdown-toggle.ohno:hover,.button.icon-only-button.ohno:focus-visible,.button.icon-only-button.ohno:hover,button.dropdown-toggle.ohno:focus-visible,button.dropdown-toggle.ohno:hover,button.icon-only-button.ohno:focus-visible,button.icon-only-button.ohno:hover{background-color:#ebedf0;border:none;color:#b33636}.button.dropdown-toggle.yay,.button.icon-only-button.yay,button.dropdown-toggle.yay,button.icon-only-button.yay{background-color:transparent;border:none;color:#00b377}.button.dropdown-toggle.yay:focus-visible,.button.dropdown-toggle.yay:hover,.button.icon-only-button.yay:focus-visible,.button.icon-only-button.yay:hover,button.dropdown-toggle.yay:focus-visible,button.dropdown-toggle.yay:hover,button.icon-only-button.yay:focus-visible,button.icon-only-button.yay:hover{background-color:#ebedf0;border:none;color:#008055}@media (prefers-reduced-motion){html{scroll-behavior:auto}.a,.button,a,button,input[type=checkbox],input[type=password],input[type=radio],input[type=text],textarea{transition-duration:0s}.card,.card.double{perspective:none}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:flat;transition-duration:0s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:visible;-webkit-backface-visibility:visible;-moz-backface-visibility:visible;background-color:#f0f2f5;border-radius:.8rem;height:100%;justify-content:center;position:absolute;text-align:center;transform:none;width:100%}.card.double>.content>.back{display:none;transform:none}.card.double>.content>.front{display:flex}.card.double.flip>.content{transform:none}.card.double.flip>.content>.back{display:flex}.card.double.flip>.content>.front{display:none}}@media (prefers-color-scheme:dark){ /*! EhUI is free and open source Copyright (c) Ehan Ahamed and contributors https://ehan.dev/ehui/LICENSE.txt -*/:root{color-scheme:dark}html{font-size:18px;height:auto;scroll-behavior:smooth}@media only screen and (max-width:800px){html{font-size:16px}}body{background-color:#20202e;color:#c3cce9;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;height:auto;line-height:1.4;margin:0}::selection{background-color:#533380;color:#c3cce9}.h1,h1{font-size:3.4rem}.h1,.h2,h1,h2{font-weight:700;margin-bottom:1rem;margin-top:0}.h2,h2{font-size:2.8rem}.h3,h3{font-size:2.2rem}.h3,.h4,h3,h4{font-weight:700;margin-bottom:1rem;margin-top:0}.h4,h4{font-size:1.6rem}.h1,.h2,.h3,.h4,h1,h2,h3,h4{line-height:1.2}.h5,h5,p{font-size:1rem;font-weight:400;margin-bottom:1rem;margin-top:0}p{margin-block-end:0}.h6,h6,small{font-size:.8rem;font-weight:400;margin-bottom:1rem}.h5,.h6,h5,h6,p,small{line-height:1.4}.b,b{font-weight:700}.i,i{font-style:italic}i.nf{font-style:normal}.s,s{text-decoration:line-through}.mark,mark{background-color:#c3cce9;color:#20202e}.code,.mark,code,mark{border-radius:.4rem;font-size:1rem;line-height:1.4;padding:.2rem .4rem}.code,code{font-family:monospace}.box,.code,code{background-color:#242433}.box{border:.2rem solid #242433;border-radius:.8rem;color:#c3cce9;padding:1rem}.hero{border-bottom:.2rem solid #2e2e42;margin:4rem 1rem;padding:1rem 1rem 4rem;text-align:center}.topmost{margin:1rem}.header,header{background-color:#20202e;border-bottom:.2rem solid #2e2e42;height:4rem;margin:0 0 1rem;padding:0;position:static}.header.sticky,header.sticky{margin:0;position:sticky;top:0;z-index:100}header>.nav{align-items:center;display:flex;gap:1rem;margin:0 1rem}.nav>div{border-bottom:.2rem solid #20202e}.nav>div.current{border-bottom:.2rem solid #b899ff}.nav>div.current>a{color:#b899ff}.footer,footer{border-top:.2rem solid #2e2e42;margin:4rem 1rem;padding:4rem 1rem 1rem;text-align:center}table{border:.2rem solid #2e2e42;border-collapse:separate;border-radius:.8rem;border-spacing:0}td{font-weight:400}td,th{padding:1rem;text-align:left}th{font-weight:700}table.outer tbody,table.outer td,table.outer tfoot,table.outer th,table.outer thead{border:none}table.inner td:not(:last-child),table.inner th:not(:last-child){border-right:.2rem solid #2e2e42}table.inner>tbody:not(:last-child),table.inner>tbody>tr:not(:last-child)>td,table.inner>tbody>tr:not(:last-child)>th,table.inner>thead:not(:last-child),table.inner>thead>tr>td,table.inner>thead>tr>th,table.inner>tr:not(:last-child)>td,table.inner>tr:not(:last-child)>th{border-bottom:.2rem solid #2e2e42}.a,a{border-radius:.4rem;color:#9466ff;cursor:pointer;font-size:1rem;line-height:1.4;text-decoration:none;transition-duration:.4s}.a:focus-visible,.a:hover,a:focus-visible,a:hover{color:#b899ff}.a:focus-visible,a:focus-visible{outline:.2rem solid #9466ff;outline-offset:.4rem;transition-duration:.1s}.button,button{align-items:flex-start;appearance:none;background-color:#9466ff;border:.2rem solid #9466ff;border-radius:2rem;box-sizing:border-box;color:#20202e;cursor:pointer;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;font-weight:600;line-height:1.4;padding:.4rem .8rem;text-align:center;text-decoration:none;transition-duration:.4s}.button.alt,button.alt{background-color:#2b2b3d;border-color:#2b2b3d;color:#9466ff}.button:focus-visible,.button:hover,button:focus-visible,button:hover{background-color:#b899ff;color:#20202e}.button:focus-visible,button:focus-visible{outline:.2rem solid #9466ff;outline-offset:.2rem;transition-duration:.1s}::placeholder{color:#9399b2;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;opacity:1}input[type=password],input[type=text],textarea{align-items:flex-start;appearance:none;background-color:#20202e;border:.2rem solid #2e2e42;border-radius:.8rem;box-sizing:border-box;color:#c3cce9;cursor:text;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;line-height:1.4;outline:none;padding:.4rem .8rem;text-align:left;text-decoration:none;transition-duration:.4s}input[type=password]:hover,input[type=text]:hover,textarea:hover{border-color:#b899ff}input[type=password]:focus,input[type=password]:focus-visible,input[type=text]:focus,input[type=text]:focus-visible,textarea:focus,textarea:focus-visible{border-color:#9466ff}.checkbox,.radio{display:grid;gap:1em;grid-template-areas:"input label .";grid-template-columns:1.8rem auto 1fr}.checkbox input,.radio input{grid-area:input}.checkbox label,.radio label{grid-area:label}input[type=checkbox],input[type=radio]{appearance:none;background-color:#20202e;border:.2rem solid #9466ff;height:1.8rem;margin:0;transition-duration:.4s;width:1.8rem}input[type=radio]{border-radius:50%}input[type=checkbox]{border-radius:.6rem}input[type=checkbox]:focus-visible,input[type=checkbox]:hover,input[type=radio]:focus-visible,input[type=radio]:hover{border-color:#b899ff}input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline:.2rem solid #9466ff;outline-offset:.2rem;transition-duration:.1s}input[type=checkbox]:checked,input[type=radio]:checked{background-color:#9466ff;transition-duration:.1s}.card{height:20rem;width:40rem}.caption{display:grid;gap:1rem;grid-template-rows:1fr;width:40rem}.caption.centerThree{grid-template-columns:1fr 4fr 1fr}.caption.evenTwo{grid-template-columns:1fr 1fr}.caption.evenThree{grid-template-columns:1fr 1fr 1fr}@media only screen and (max-width:800px){.caption,.card{width:100%}}.card>.content{align-items:center;background-color:#242433;border-radius:.8rem;display:flex;height:100%;justify-content:center;position:relative;text-align:center;width:100%}.card.double{perspective:1000px}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:preserve-3d;transition:transform .4s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;background-color:#242433;border-radius:.8rem;box-shadow:0 4px 10px 2px rgba(0,0,0,.1);display:flex;height:100%;justify-content:center;margin-top:0;position:absolute;text-align:center;transform:rotateX(0deg);width:100%}.card.double.flip>.content,.card.double>.content>.back{transform:rotateY(180deg)}.separator{align-items:center;color:#9399b2;display:flex;justify-content:center}.separator:after,.separator:before{background:#2e2e42;content:"";display:block;height:.2rem;margin:0 1rem;width:100%}.modal{align-items:center;display:flex;justify-content:center;z-index:200}.modal,.modal:before{height:100vh;left:0;position:fixed;top:0;width:100vw}.modal:before{background-color:#1b1b26;content:"";opacity:.6;z-index:180}.modal>.content{background-color:#20202e;border:.2rem solid #2e2e42;border-radius:.8rem;padding:1rem;width:60vw;z-index:200}@media only screen and (max-width:800px){.modal{align-items:flex-end}.modal>.content{border:none;border-radius:0;border-top:.2rem solid #2e2e42;padding-bottom:8rem;width:100vw}}.flex.pop{padding:0 1rem}.dropdown{display:inline-block;position:relative}.dropdown .content{align-items:stretch;background:#242433;border:.2rem solid #2e2e42;border-radius:.8rem;display:none;flex-direction:column;gap:.4rem;margin-top:.4rem;padding:.4rem;position:absolute;z-index:1}.dropdown:focus-within .content{display:flex}.dropdown .content .button,.dropdown .content button{background-color:#242433;border-color:#242433;color:#9466ff;margin-top:0;text-wrap:nowrap}.dropdown .content .button:focus-visible,.dropdown .content .button:hover,.dropdown .content button:focus-visible,.dropdown .content button:hover{background-color:#2b2b3d;border-color:#2b2b3d;color:#b899ff}.button.dropdown-toggle,button.dropdown-toggle{background-color:transparent;border:none;color:#c3cce9}.button.dropdown-toggle:focus-visible,.button.dropdown-toggle:hover,button.dropdown-toggle:focus-visible,button.dropdown-toggle:hover{background-color:#2b2b3d;border:none;color:#b899ff}*,:after,:before{box-sizing:border-box}.center{text-align:center}.flex{display:flex;flex-wrap:wrap;gap:1rem}.flex.row{flex-direction:row}.flex.row.rev{flex-direction:row-reverse}.flex.col{flex-direction:column}.flex.col.rev{flex-direction:column-reverse}.flex.no-wrap,.flex.nowrap{flex-wrap:nowrap}.flex.wrap{flex-wrap:wrap}.flex.start{justify-content:flex-start}.flex.end{justify-content:flex-end}.flex.center{justify-content:center}.flex.spaceBetween{justify-content:space-between}.flex.alignStart{align-content:flex-start;align-items:flex-start}.flex.alignEnd{align-content:flex-end;align-items:flex-end}.flex.alignCenter,.flex.center-v{align-content:center;align-items:center}.flex.center-h{justify-content:center;justify-items:center}.flex.stretch{align-content:stretch;align-items:stretch}.flex.alignSpaceBetween{align-content:space-between;align-items:space-between}.flex.alignSpaceAround{align-content:space-around;align-items:space-around}.justifyselfstretch{justify-self:stretch}.justifyselfcenter{justify-self:center}.justifyselfstart{justify-self:start}.justifyselfend{justify-self:end}.grid{display:grid}.grid.split{gap:0;grid-template-areas:"left right";grid-template-columns:4fr 4fr;grid-template-rows:1fr}.grid.split>.left{grid-area:left;justify-self:right;padding-right:2rem}.grid.split>.right{border-left:.2rem solid #2e2e42;grid-area:right;justify-self:left;padding-left:2rem}.grid.split.noBorder>.left,.grid.split.noBorder>.right{border:none}@media only screen and (max-width:800px){.grid.split{grid-template-areas:"left" "right";grid-template-columns:1fr;grid-template-rows:auto auto;padding:0 2rem}.grid.split>.left,.grid.split>.right{border:none;justify-self:left;padding-left:0;padding-right:0}}.grid.list{gap:1rem;grid-template-columns:1fr 1fr 1fr;margin-bottom:2rem}.grid.split .grid.list{grid-template-columns:1fr}@media only screen and (max-width:800px){.grid.list{grid-template-columns:1fr}}.grid.hero{grid-template-areas:"content . logo";grid-template-columns:6fr 2fr 6fr;grid-template-rows:1fr}.grid.hero>.content{align-self:center;grid-area:content;justify-self:end;text-align:center}.grid.hero>.logo{align-self:center;grid-area:logo;justify-self:start}@media only screen and (max-width:800px){.grid.hero{grid-template-areas:"logo" "content";grid-template-columns:1fr;grid-template-rows:1fr 1fr}.grid.hero>.content,.grid.hero>.logo{justify-self:center}}.grid.intro{border-bottom:.2rem solid #2e2e42;gap:4rem;grid-template-areas:"logotype actions" "content content";grid-template-columns:1fr 1fr;grid-template-rows:auto auto;margin:0 1rem 4rem;padding:1rem 2rem 4rem}.grid.intro>.logotype{align-items:center;display:flex;gap:1rem;grid-area:logotype;justify-content:start;justify-items:start}.grid.intro>.logotype p{margin-bottom:0}.grid.intro>.logotype>.logo{height:4rem;width:4rem}.grid.intro>.content{grid-area:content;text-align:center}@media only screen and (max-width:800px){.grid.intro{padding-left:1rem;padding-right:1rem}}.grid.page{grid-template-areas:". content .";grid-template-columns:2fr 10fr 2fr;grid-template-rows:1fr}.grid.page>.content{align-self:start;grid-area:content;justify-self:stretch}@media only screen and (max-width:800px){.grid.page{grid-template-columns:1fr 12fr 1fr}}.grid.screen{height:100%;margin:0 1rem}.grid.screen>.content{align-self:center;justify-self:center;margin-top:0}html.screen{height:100%}html.screen body{display:grid;grid-template-rows:auto 1fr;height:100%}header{display:grid;gap:1rem;grid-template-areas:"menu";grid-template-columns:1fr}header>.menu{grid-area:menu;justify-self:left;text-align:left}header>.options{grid-area:options;justify-self:right;padding:1rem;text-align:right}.nav>div{align-items:center;display:flex;height:100%}*+*,*+h1,*+h2,*+h3,*+h4,*+h5,*+h6,*+p{margin-top:1rem}.caption>*,.caption>div>*,.checkbox>*,.flex>*,.grid>*,.logotype>*,.nav>div,.radio>*,header>*{margin-top:0}.grid.paragraph{gap:1rem;grid-template-areas:"content image";grid-template-columns:1fr 1fr}.grid.paragraph.alt{grid-template-areas:"image content"}.grid.paragraph>.content{grid-area:content}.grid.paragraph>.image{align-items:center;display:flex;grid-area:image;justify-items:center}@media only screen and (max-width:1000px){.grid.paragraph,.grid.paragraph.alt{gap:1rem;grid-template-areas:"content" "image";grid-template-columns:1fr;grid-template-rows:1fr auto}}a.mark{color:#9466ff}a.mark:focus-visible,a.mark:hover{color:#b899ff}.mark.ohno,.text.ohno,b.ohno,code.ohno,i.ohno,mark.ohno,p.ohno,span.ohno,u.ohno{color:#f66}.mark.yay,.text.yay,b.yay,code.yay,i.yay,mark.yay,p.yay,span.yay,u.yay{color:#6fc}.mark.bg1,.text.bg1,b.bg1,code.bg1,i.bg1,mark.bg1,p.bg1,span.bg1,u.bg1{color:#20202e}.mark.fg1,.mark.fg2,.text.fg1,.text.fg2,b.fg1,b.fg2,code.fg1,code.fg2,i.fg1,i.fg2,mark.fg1,mark.fg2,p.fg1,p.fg2,span.fg1,span.fg2,u.fg1,u.fg2{color:#c3cce9}.mark.fg0,.text.fg0,b.fg0,code.fg0,i.fg0,mark.fg0,p.fg0,span.fg0,u.fg0{color:#9399b2}.mark.main,.text.main,b.main,code.main,i.main,mark.main,p.main,span.main,u.main{color:#9466ff}.mark.extra,.text.extra,b.extra,code.extra,i.extra,mark.extra,p.extra,span.extra,u.extra{color:#6fc}.mark.markOhno,mark.markOhno{background-color:#f66}.mark.markYay,mark.markYay{background-color:#6fc}.mark.markBg4,mark.markBg4{background-color:#2e2e42}.mark.markBg2,mark.markBg2{background-color:#242433}.mark.markFg1,.mark.markFg2,mark.markFg1,mark.markFg2{background-color:#c3cce9}.mark.markFg0,mark.markFg0{background-color:#9399b2}.mark.markMain,mark.markMain{background-color:#9466ff}.mark.markExtra,mark.markExtra{background-color:#6fc}.box.ohno{border-color:#f66;color:#f66}.box.yay{border-color:#6fc;color:#6fc}.pre,pre{white-space:pre}.button.ohno,button.ohno{background-color:#f66;border-color:#f66}.button.extra,.button.yay,button.extra,button.yay{background-color:#6fc;border-color:#6fc}.button.extra,button.extra{color:#1b1b26}.button.alt.ohno,button.alt.ohno{background-color:#2b2b3d;border-color:#2b2b3d;color:#f66}.button.alt.extra,.button.alt.yay,button.alt.extra,button.alt.yay{background-color:#2b2b3d;border-color:#2b2b3d;color:#6fc}.button:focus-visible.ohno,.button:hover.ohno,button:focus-visible.ohno,button:hover.ohno{background-color:#f99;color:#20202e}.button:focus-visible.yay,.button:hover.yay,button:focus-visible.yay,button:hover.yay{background-color:#cfe;color:#20202e}.button:focus-visible.extra,.button:hover.extra,button:focus-visible.extra,button:hover.extra{background-color:#cfe;color:#1b1b26}.button:focus-visible.ohno,button:focus-visible.ohno{outline-color:#f66}.button:focus-visible.yay,button:focus-visible.yay{outline-color:#6fc}.button:focus-visible.extra,button:focus-visible.extra{outline-color:#6fc}input[type=password].ohno:hover,input[type=text].ohno:hover,textarea.ohno:hover{border-color:#f99}input[type=password].extra:hover,input[type=password].yay:hover,input[type=text].extra:hover,input[type=text].yay:hover,textarea.extra:hover,textarea.yay:hover{border-color:#cfe}input[type=password].ohno:focus,input[type=password].ohno:focus-visible,input[type=text].ohno:focus,input[type=text].ohno:focus-visible,textarea.ohno:focus,textarea.ohno:focus-visible{border-color:#f66}input[type=password].yay:focus,input[type=password].yay:focus-visible,input[type=text].yay:focus,input[type=text].yay:focus-visible,textarea.yay:focus,textarea.yay:focus-visible{border-color:#6fc}input[type=password].extra:focus,input[type=password].extra:focus-visible,input[type=text].extra:focus,input[type=text].extra:focus-visible,textarea.extra:focus,textarea.extra:focus-visible{border-color:#6fc}textarea.vertical{resize:vertical;white-space:pre}textarea.horizontal{resize:horizontal;white-space:pre}.hide{display:none}.fullscreen{align-items:center;background:#20202e;display:flex;height:100vh;justify-content:center;left:0;margin:0;position:fixed;top:0;width:100vw;z-index:200}.exitFullscreen{display:none;left:1rem;margin:0;position:fixed;top:1rem}.fullscreen>.button.exitFullscreen,.fullscreen>button.exitFullscreen{display:inline-block}.invisible{height:1px;margin:0;opacity:0;overflow:hidden;position:absolute;width:1px}.hero>.logo:before{background-color:#9466ff;border-radius:50%;content:"";filter:blur(1rem);height:200px;opacity:.2;position:absolute;width:200px;z-index:-100}html.min .hero>.logo:before{display:none}.hero>.logo>svg{margin-top:0}.fullWidth{width:100%}.grid.page.extra{background-color:#1b1b26;margin-bottom:0;margin-top:0;padding-bottom:1rem}.button.large,button.large{font-size:1.2rem;line-height:1.6rem;padding:.6rem 1.2rem}.fill-ohno{fill:#f66}.fill-ohno-alt{fill:#f99}.fill-yay{fill:#6fc}.fill-yay-alt{fill:#cfe}.fill-main{fill:#9466ff}.fill-main-alt{fill:#b899ff}.fill-extra{fill:#6fc}.fill-extra-alt{fill:#cfe}.fill-extra-bg{fill:#1b1b26}.fill-fg1,.fill-fg2{fill:#c3cce9}.fill-fg0{fill:#9399b2}.fill-bg4{fill:#2e2e42}.fill-bg3{fill:#2b2b3d}.fill-bg2{fill:#242433}.fill-bg1{fill:#20202e}.fill-bg0{fill:#1b1b26}.background-extra-bg{background-color:#1b1b26}.background-bg2{background-color:#242433}.background-bg1{background-color:#20202e}.background-bg0{background-color:#1b1b26}.dropdown .content .button.ohno,.dropdown .content button.ohno{background-color:#242433;border-color:#242433;color:#f66}.dropdown .content .button.yay,.dropdown .content button.yay{background-color:#242433;border-color:#242433;color:#6fc}.dropdown .content .button.ohno:focus-visible,.dropdown .content .button.ohno:hover,.dropdown .content button.ohno:focus-visible,.dropdown .content button.ohno:hover{background-color:#2b2b3d;border-color:#2b2b3d;color:#f99}.dropdown .content .button.yay:focus-visible,.dropdown .content .button.yay:hover,.dropdown .content button.yay:focus-visible,.dropdown .content button.yay:hover{background-color:#2b2b3d;border-color:#2b2b3d;color:#cfe}@media (prefers-reduced-motion){html{scroll-behavior:auto}.a,.button,a,button,input[type=checkbox],input[type=password],input[type=radio],input[type=text],textarea{transition-duration:0s}.card,.card.double{perspective:none}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:flat;transition-duration:0s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:visible;-webkit-backface-visibility:visible;-moz-backface-visibility:visible;background-color:#242433;border-radius:.8rem;height:100%;justify-content:center;position:absolute;text-align:center;transform:none;width:100%}.card.double>.content>.back{display:none;transform:none}.card.double>.content>.front{display:flex}.card.double.flip>.content{transform:none}.card.double.flip>.content>.back{display:flex}.card.double.flip>.content>.front{display:none}}} \ No newline at end of file +*/:root{color-scheme:dark}html{font-size:18px;height:auto;scroll-behavior:smooth}@media only screen and (max-width:800px){html{font-size:16px}}body{background-color:#20202e;color:#c3cce9;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;height:auto;line-height:1.4;margin:0}::selection{background-color:#533380;color:#c3cce9}.h1,h1{font-size:3.4rem}.h1,.h2,h1,h2{font-weight:700;margin-bottom:1rem;margin-top:0}.h2,h2{font-size:2.8rem}.h3,h3{font-size:2.2rem}.h3,.h4,h3,h4{font-weight:700;margin-bottom:1rem;margin-top:0}.h4,h4{font-size:1.6rem}.h1,.h2,.h3,.h4,h1,h2,h3,h4{line-height:1.2}.h5,h5,p{font-size:1rem;font-weight:400;margin-bottom:1rem;margin-top:0}p{margin-block-end:0}.h6,h6,small{font-size:.8rem;font-weight:400;margin-bottom:1rem}.h5,.h6,h5,h6,p,small{line-height:1.4}.b,b{font-weight:700}.i,i{font-style:italic}i.nf{font-style:normal}.s,s{text-decoration:line-through}.mark,mark{background-color:#c3cce9;color:#20202e}.code,.mark,code,mark{border-radius:.4rem;font-size:1rem;line-height:1.4;padding:.2rem .4rem}.code,code{font-family:monospace}.box,.code,code{background-color:#242433}.box{border:.2rem solid #242433;border-radius:.8rem;color:#c3cce9;padding:1rem}.hero{border-bottom:.2rem solid #2e2e42;margin:4rem 1rem;padding:1rem 1rem 4rem;text-align:center}.topmost{margin:1rem}.header,header{background-color:#20202e;border-bottom:.2rem solid #2e2e42;height:4rem;margin:0 0 1rem;padding:0;position:static}.header.sticky,header.sticky{margin:0;position:sticky;top:0;z-index:100}header>.nav{align-items:center;display:flex;gap:1rem;margin:0 1rem}.nav>div{border-bottom:.2rem solid #20202e}.nav>div.current{border-bottom:.2rem solid #b899ff}.nav>div.current>a{color:#b899ff}.footer,footer{border-top:.2rem solid #2e2e42;margin:4rem 1rem;padding:4rem 1rem 1rem;text-align:center}table{border:.2rem solid #2e2e42;border-collapse:separate;border-radius:.8rem;border-spacing:0}td{font-weight:400}td,th{padding:1rem;text-align:left}th{font-weight:700}table.outer tbody,table.outer td,table.outer tfoot,table.outer th,table.outer thead{border:none}table.inner td:not(:last-child),table.inner th:not(:last-child){border-right:.2rem solid #2e2e42}table.inner>tbody:not(:last-child),table.inner>tbody>tr:not(:last-child)>td,table.inner>tbody>tr:not(:last-child)>th,table.inner>thead:not(:last-child),table.inner>thead>tr>td,table.inner>thead>tr>th,table.inner>tr:not(:last-child)>td,table.inner>tr:not(:last-child)>th{border-bottom:.2rem solid #2e2e42}.a,a{border-radius:.4rem;color:#9466ff;cursor:pointer;font-size:1rem;line-height:1.4;text-decoration:none;transition-duration:.4s}.a:focus-visible,.a:hover,a:focus-visible,a:hover{color:#b899ff}.a:focus-visible,a:focus-visible{outline:.2rem solid #9466ff;outline-offset:.4rem;transition-duration:.1s}.button,button{align-items:flex-start;appearance:none;background-color:#9466ff;border:.2rem solid #9466ff;border-radius:2rem;box-sizing:border-box;color:#20202e;cursor:pointer;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;font-weight:600;line-height:1.4;padding:.4rem .8rem;text-align:center;text-decoration:none;transition-duration:.4s}.button.alt,button.alt{background-color:#2b2b3d;border-color:#2b2b3d;color:#9466ff}.button:focus-visible,.button:hover,button:focus-visible,button:hover{background-color:#b899ff;color:#20202e}.button:focus-visible,button:focus-visible{outline:.2rem solid #9466ff;outline-offset:.2rem;transition-duration:.1s}::placeholder{color:#9399b2;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;opacity:1}input[type=password],input[type=text],textarea{align-items:flex-start;appearance:none;background-color:#20202e;border:.2rem solid #2e2e42;border-radius:.8rem;box-sizing:border-box;color:#c3cce9;cursor:text;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;line-height:1.4;outline:none;padding:.4rem .8rem;text-align:left;text-decoration:none;transition-duration:.4s}input[type=password]:hover,input[type=text]:hover,textarea:hover{border-color:#b899ff}input[type=password]:focus,input[type=password]:focus-visible,input[type=text]:focus,input[type=text]:focus-visible,textarea:focus,textarea:focus-visible{border-color:#9466ff}.checkbox,.radio{display:grid;gap:1em;grid-template-areas:"input label .";grid-template-columns:1.8rem auto 1fr}.checkbox input,.radio input{grid-area:input}.checkbox label,.radio label{grid-area:label}input[type=checkbox],input[type=radio]{appearance:none;background-color:#20202e;border:.2rem solid #9466ff;height:1.8rem;margin:0;transition-duration:.4s;width:1.8rem}input[type=radio]{border-radius:50%}input[type=checkbox]{border-radius:.6rem}input[type=checkbox]:focus-visible,input[type=checkbox]:hover,input[type=radio]:focus-visible,input[type=radio]:hover{border-color:#b899ff}input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline:.2rem solid #9466ff;outline-offset:.2rem;transition-duration:.1s}input[type=checkbox]:checked,input[type=radio]:checked{background-color:#9466ff;transition-duration:.1s}.card{height:20rem;width:40rem}.caption{display:grid;gap:1rem;grid-template-rows:1fr;width:40rem}.caption.centerThree{grid-template-columns:1fr 4fr 1fr}.caption.evenTwo{grid-template-columns:1fr 1fr}.caption.evenThree{grid-template-columns:1fr 1fr 1fr}@media only screen and (max-width:800px){.caption,.card{width:100%}}.card>.content{align-items:center;background-color:#242433;border-radius:.8rem;display:flex;height:100%;justify-content:center;position:relative;text-align:center;width:100%}.card.double{perspective:1000px}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:preserve-3d;transition:transform .4s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;background-color:#242433;border-radius:.8rem;box-shadow:0 4px 10px 2px rgba(0,0,0,.1);display:flex;height:100%;justify-content:center;margin-top:0;position:absolute;text-align:center;transform:rotateX(0deg);width:100%}.card.double.flip>.content,.card.double>.content>.back{transform:rotateY(180deg)}.separator{align-items:center;color:#9399b2;display:flex;justify-content:center}.separator:after,.separator:before{background:#2e2e42;content:"";display:block;height:.2rem;margin:0 1rem;width:100%}.modal{align-items:center;display:flex;justify-content:center;z-index:200}.modal,.modal:before{height:100vh;left:0;position:fixed;top:0;width:100vw}.modal:before{background-color:#1b1b26;content:"";opacity:.6;z-index:180}.modal>.content{background-color:#20202e;border:.2rem solid #2e2e42;border-radius:.8rem;padding:1rem;width:60vw;z-index:200}@media only screen and (max-width:800px){.modal{align-items:flex-end}.modal>.content{border:none;border-radius:0;border-top:.2rem solid #2e2e42;padding-bottom:8rem;width:100vw}}.flex.pop{padding:0 1rem}.dropdown{display:inline-block;position:relative}.dropdown .content{align-items:stretch;background:#242433;border:.2rem solid #2e2e42;border-radius:.8rem;display:none;flex-direction:column;gap:.4rem;margin-top:.4rem;padding:.4rem;position:absolute;z-index:1}.dropdown:focus-within .content{display:flex}.dropdown .content .button,.dropdown .content button{background-color:#242433;border-color:#242433;color:#9466ff;margin-top:0;text-wrap:nowrap}.dropdown .content .button:focus-visible,.dropdown .content .button:hover,.dropdown .content button:focus-visible,.dropdown .content button:hover{background-color:#2b2b3d;border-color:#2b2b3d;color:#b899ff}.button.dropdown-toggle,.button.icon-only-button,button.dropdown-toggle,button.icon-only-button{background-color:transparent;border:none;color:#c3cce9}.button.dropdown-toggle:focus-visible,.button.dropdown-toggle:hover,.button.icon-only-button:focus-visible,.button.icon-only-button:hover,button.dropdown-toggle:focus-visible,button.dropdown-toggle:hover,button.icon-only-button:focus-visible,button.icon-only-button:hover{background-color:#2b2b3d;border:none;color:#b899ff}*,:after,:before{box-sizing:border-box}.center{text-align:center}.flex{display:flex;flex-wrap:wrap;gap:1rem}.flex.row{flex-direction:row}.flex.row.rev{flex-direction:row-reverse}.flex.col{flex-direction:column}.flex.col.rev{flex-direction:column-reverse}.flex.no-wrap,.flex.nowrap{flex-wrap:nowrap}.flex.wrap{flex-wrap:wrap}.flex.start{justify-content:flex-start}.flex.end{justify-content:flex-end}.flex.center{justify-content:center}.flex.spaceBetween{justify-content:space-between}.flex.alignStart{align-content:flex-start;align-items:flex-start}.flex.alignEnd{align-content:flex-end;align-items:flex-end}.flex.alignCenter,.flex.center-v{align-content:center;align-items:center}.flex.center-h{justify-content:center;justify-items:center}.flex.stretch{align-content:stretch;align-items:stretch}.flex.alignSpaceBetween{align-content:space-between;align-items:space-between}.flex.alignSpaceAround{align-content:space-around;align-items:space-around}.justifyselfstretch{justify-self:stretch}.justifyselfcenter{justify-self:center}.justifyselfstart{justify-self:start}.justifyselfend{justify-self:end}.flex.compact-gap{gap:.2rem}.grid{display:grid}.grid.split{gap:0;grid-template-areas:"left right";grid-template-columns:4fr 4fr;grid-template-rows:1fr}.grid.split>.left{grid-area:left;justify-self:right;padding-right:2rem}.grid.split>.right{border-left:.2rem solid #2e2e42;grid-area:right;justify-self:left;padding-left:2rem}.grid.split.noBorder>.left,.grid.split.noBorder>.right{border:none}@media only screen and (max-width:800px){.grid.split{grid-template-areas:"left" "right";grid-template-columns:1fr;grid-template-rows:auto auto;padding:0 2rem}.grid.split>.left,.grid.split>.right{border:none;justify-self:left;padding-left:0;padding-right:0}}.grid.list{gap:1rem;grid-template-columns:1fr 1fr 1fr;margin-bottom:2rem}.grid.split .grid.list{grid-template-columns:1fr}@media only screen and (max-width:800px){.grid.list{grid-template-columns:1fr}}.grid.hero{grid-template-areas:"content . logo";grid-template-columns:6fr 2fr 6fr;grid-template-rows:1fr}.grid.hero>.content{align-self:center;grid-area:content;justify-self:end;text-align:center}.grid.hero>.logo{align-self:center;grid-area:logo;justify-self:start}@media only screen and (max-width:800px){.grid.hero{grid-template-areas:"logo" "content";grid-template-columns:1fr;grid-template-rows:1fr 1fr}.grid.hero>.content,.grid.hero>.logo{justify-self:center}}.grid.intro{border-bottom:.2rem solid #2e2e42;gap:4rem;grid-template-areas:"logotype actions" "content content";grid-template-columns:1fr 1fr;grid-template-rows:auto auto;margin:0 1rem 4rem;padding:1rem 2rem 4rem}.grid.intro>.logotype{align-items:center;display:flex;gap:1rem;grid-area:logotype;justify-content:start;justify-items:start}.grid.intro>.logotype p{margin-bottom:0}.grid.intro>.logotype>.logo{height:4rem;width:4rem}.grid.intro>.content{grid-area:content;text-align:center}@media only screen and (max-width:800px){.grid.intro{padding-left:1rem;padding-right:1rem}}.grid.page{grid-template-areas:". content .";grid-template-columns:2fr 10fr 2fr;grid-template-rows:1fr}.grid.page>.content{align-self:start;grid-area:content;justify-self:stretch}@media only screen and (max-width:800px){.grid.page{grid-template-columns:1fr 12fr 1fr}}.grid.screen{height:100%;margin:0 1rem}.grid.screen>.content{align-self:center;justify-self:center;margin-top:0}html.screen{height:100%}html.screen body{display:grid;grid-template-rows:auto 1fr;height:100%}header{display:grid;gap:1rem;grid-template-areas:"menu";grid-template-columns:1fr}header>.menu{grid-area:menu;justify-self:left;text-align:left}header>.options{grid-area:options;justify-self:right;padding:1rem;text-align:right}.nav>div{align-items:center;display:flex;height:100%}*+*,*+h1,*+h2,*+h3,*+h4,*+h5,*+h6,*+p{margin-top:1rem}.caption>*,.caption>div>*,.checkbox>*,.flex>*,.grid>*,.logotype>*,.nav>div,.radio>*,header>*{margin-top:0}.grid.paragraph{gap:1rem;grid-template-areas:"content image";grid-template-columns:1fr 1fr}.grid.paragraph.alt{grid-template-areas:"image content"}.grid.paragraph>.content{grid-area:content}.grid.paragraph>.image{align-items:center;display:flex;grid-area:image;justify-items:center}@media only screen and (max-width:1000px){.grid.paragraph,.grid.paragraph.alt{gap:1rem;grid-template-areas:"content" "image";grid-template-columns:1fr;grid-template-rows:1fr auto}}a.mark{color:#9466ff}a.mark:focus-visible,a.mark:hover{color:#b899ff}.mark.ohno,.text.ohno,b.ohno,code.ohno,i.ohno,mark.ohno,p.ohno,span.ohno,u.ohno{color:#f66}.mark.yay,.text.yay,b.yay,code.yay,i.yay,mark.yay,p.yay,span.yay,u.yay{color:#6fc}.mark.bg1,.text.bg1,b.bg1,code.bg1,i.bg1,mark.bg1,p.bg1,span.bg1,u.bg1{color:#20202e}.mark.fg1,.mark.fg2,.text.fg1,.text.fg2,b.fg1,b.fg2,code.fg1,code.fg2,i.fg1,i.fg2,mark.fg1,mark.fg2,p.fg1,p.fg2,span.fg1,span.fg2,u.fg1,u.fg2{color:#c3cce9}.mark.fg0,.text.fg0,b.fg0,code.fg0,i.fg0,mark.fg0,p.fg0,span.fg0,u.fg0{color:#9399b2}.mark.main,.text.main,b.main,code.main,i.main,mark.main,p.main,span.main,u.main{color:#9466ff}.mark.extra,.text.extra,b.extra,code.extra,i.extra,mark.extra,p.extra,span.extra,u.extra{color:#6fc}.mark.markOhno,mark.markOhno{background-color:#f66}.mark.markYay,mark.markYay{background-color:#6fc}.mark.markBg4,mark.markBg4{background-color:#2e2e42}.mark.markBg2,mark.markBg2{background-color:#242433}.mark.markFg1,.mark.markFg2,mark.markFg1,mark.markFg2{background-color:#c3cce9}.mark.markFg0,mark.markFg0{background-color:#9399b2}.mark.markMain,mark.markMain{background-color:#9466ff}.mark.markExtra,mark.markExtra{background-color:#6fc}.box.ohno{border-color:#f66;color:#f66}.box.yay{border-color:#6fc;color:#6fc}.pre,pre{white-space:pre}.button.ohno,button.ohno{background-color:#f66;border-color:#f66}.button.extra,.button.yay,button.extra,button.yay{background-color:#6fc;border-color:#6fc}.button.extra,button.extra{color:#1b1b26}.button.alt.ohno,button.alt.ohno{background-color:#2b2b3d;border-color:#2b2b3d;color:#f66}.button.alt.extra,.button.alt.yay,button.alt.extra,button.alt.yay{background-color:#2b2b3d;border-color:#2b2b3d;color:#6fc}.button:focus-visible.ohno,.button:hover.ohno,button:focus-visible.ohno,button:hover.ohno{background-color:#f99;color:#20202e}.button:focus-visible.yay,.button:hover.yay,button:focus-visible.yay,button:hover.yay{background-color:#cfe;color:#20202e}.button:focus-visible.extra,.button:hover.extra,button:focus-visible.extra,button:hover.extra{background-color:#cfe;color:#1b1b26}.button:focus-visible.ohno,button:focus-visible.ohno{outline-color:#f66}.button:focus-visible.yay,button:focus-visible.yay{outline-color:#6fc}.button:focus-visible.extra,button:focus-visible.extra{outline-color:#6fc}input[type=password].ohno:hover,input[type=text].ohno:hover,textarea.ohno:hover{border-color:#f99}input[type=password].extra:hover,input[type=password].yay:hover,input[type=text].extra:hover,input[type=text].yay:hover,textarea.extra:hover,textarea.yay:hover{border-color:#cfe}input[type=password].ohno:focus,input[type=password].ohno:focus-visible,input[type=text].ohno:focus,input[type=text].ohno:focus-visible,textarea.ohno:focus,textarea.ohno:focus-visible{border-color:#f66}input[type=password].yay:focus,input[type=password].yay:focus-visible,input[type=text].yay:focus,input[type=text].yay:focus-visible,textarea.yay:focus,textarea.yay:focus-visible{border-color:#6fc}input[type=password].extra:focus,input[type=password].extra:focus-visible,input[type=text].extra:focus,input[type=text].extra:focus-visible,textarea.extra:focus,textarea.extra:focus-visible{border-color:#6fc}textarea.vertical{resize:vertical;white-space:pre}textarea.horizontal{resize:horizontal;white-space:pre}.hide{display:none}.fullscreen{align-items:center;background:#20202e;display:flex;height:100vh;justify-content:center;left:0;margin:0;position:fixed;top:0;width:100vw;z-index:200}.exitFullscreen{display:none;left:1rem;margin:0;position:fixed;top:1rem}.fullscreen>.button.exitFullscreen,.fullscreen>button.exitFullscreen{display:inline-block}.invisible{height:1px;margin:0;opacity:0;overflow:hidden;position:absolute;width:1px}.hero>.logo:before{background-color:#9466ff;border-radius:50%;content:"";filter:blur(1rem);height:200px;opacity:.2;position:absolute;width:200px;z-index:-100}html.min .hero>.logo:before{display:none}.hero>.logo>svg{margin-top:0}.fullWidth{width:100%}.grid.page.extra{background-color:#1b1b26;margin-bottom:0;margin-top:0;padding-bottom:1rem}.button.large,button.large{font-size:1.2rem;line-height:1.6rem;padding:.6rem 1.2rem}.fill-ohno{fill:#f66}.fill-ohno-alt{fill:#f99}.fill-yay{fill:#6fc}.fill-yay-alt{fill:#cfe}.fill-main{fill:#9466ff}.fill-main-alt{fill:#b899ff}.fill-extra{fill:#6fc}.fill-extra-alt{fill:#cfe}.fill-extra-bg{fill:#1b1b26}.fill-fg1,.fill-fg2{fill:#c3cce9}.fill-fg0{fill:#9399b2}.fill-bg4{fill:#2e2e42}.fill-bg3{fill:#2b2b3d}.fill-bg2{fill:#242433}.fill-bg1{fill:#20202e}.fill-bg0{fill:#1b1b26}.background-extra-bg{background-color:#1b1b26}.background-bg2{background-color:#242433}.background-bg1{background-color:#20202e}.background-bg0{background-color:#1b1b26}.dropdown .content .button.ohno,.dropdown .content button.ohno{background-color:#242433;border-color:#242433;color:#f66}.dropdown .content .button.yay,.dropdown .content button.yay{background-color:#242433;border-color:#242433;color:#6fc}.dropdown .content .button.ohno:focus-visible,.dropdown .content .button.ohno:hover,.dropdown .content button.ohno:focus-visible,.dropdown .content button.ohno:hover{background-color:#2b2b3d;border-color:#2b2b3d;color:#f99}.dropdown .content .button.yay:focus-visible,.dropdown .content .button.yay:hover,.dropdown .content button.yay:focus-visible,.dropdown .content button.yay:hover{background-color:#2b2b3d;border-color:#2b2b3d;color:#cfe}.button.dropdown-toggle.ohno,.button.icon-only-button.ohno,button.dropdown-toggle.ohno,button.icon-only-button.ohno{background-color:transparent;border:none;color:#f66}.button.dropdown-toggle.ohno:focus-visible,.button.dropdown-toggle.ohno:hover,.button.icon-only-button.ohno:focus-visible,.button.icon-only-button.ohno:hover,button.dropdown-toggle.ohno:focus-visible,button.dropdown-toggle.ohno:hover,button.icon-only-button.ohno:focus-visible,button.icon-only-button.ohno:hover{background-color:#2b2b3d;border:none;color:#f99}.button.dropdown-toggle.yay,.button.icon-only-button.yay,button.dropdown-toggle.yay,button.icon-only-button.yay{background-color:transparent;border:none;color:#6fc}.button.dropdown-toggle.yay:focus-visible,.button.dropdown-toggle.yay:hover,.button.icon-only-button.yay:focus-visible,.button.icon-only-button.yay:hover,button.dropdown-toggle.yay:focus-visible,button.dropdown-toggle.yay:hover,button.icon-only-button.yay:focus-visible,button.icon-only-button.yay:hover{background-color:#2b2b3d;border:none;color:#cfe}@media (prefers-reduced-motion){html{scroll-behavior:auto}.a,.button,a,button,input[type=checkbox],input[type=password],input[type=radio],input[type=text],textarea{transition-duration:0s}.card,.card.double{perspective:none}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:flat;transition-duration:0s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:visible;-webkit-backface-visibility:visible;-moz-backface-visibility:visible;background-color:#242433;border-radius:.8rem;height:100%;justify-content:center;position:absolute;text-align:center;transform:none;width:100%}.card.double>.content>.back{display:none;transform:none}.card.double>.content>.front{display:flex}.card.double.flip>.content{transform:none}.card.double.flip>.content>.back{display:flex}.card.double.flip>.content>.front{display:none}}} \ No newline at end of file diff --git a/site/css/ehui-dark.min.css b/site/css/ehui-dark.min.css index 42a0efd..b16b055 100644 --- a/site/css/ehui-dark.min.css +++ b/site/css/ehui-dark.min.css @@ -2,4 +2,4 @@ EhUI is free and open source Copyright (c) Ehan Ahamed and contributors https://ehan.dev/ehui/LICENSE.txt -*/:root{color-scheme:dark}html{font-size:18px;height:auto;scroll-behavior:smooth}@media only screen and (max-width:800px){html{font-size:16px}}body{background-color:#20202e;color:#c3cce9;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;height:auto;line-height:1.4;margin:0}::selection{background-color:#533380;color:#c3cce9}.h1,h1{font-size:3.4rem}.h1,.h2,h1,h2{font-weight:700;margin-bottom:1rem;margin-top:0}.h2,h2{font-size:2.8rem}.h3,h3{font-size:2.2rem}.h3,.h4,h3,h4{font-weight:700;margin-bottom:1rem;margin-top:0}.h4,h4{font-size:1.6rem}.h1,.h2,.h3,.h4,h1,h2,h3,h4{line-height:1.2}.h5,h5,p{font-size:1rem;font-weight:400;margin-bottom:1rem;margin-top:0}p{margin-block-end:0}.h6,h6,small{font-size:.8rem;font-weight:400;margin-bottom:1rem}.h5,.h6,h5,h6,p,small{line-height:1.4}.b,b{font-weight:700}.i,i{font-style:italic}i.nf{font-style:normal}.s,s{text-decoration:line-through}.mark,mark{background-color:#c3cce9;color:#20202e}.code,.mark,code,mark{border-radius:.4rem;font-size:1rem;line-height:1.4;padding:.2rem .4rem}.code,code{font-family:monospace}.box,.code,code{background-color:#242433}.box{border:.2rem solid #242433;border-radius:.8rem;color:#c3cce9;padding:1rem}.hero{border-bottom:.2rem solid #2e2e42;margin:4rem 1rem;padding:1rem 1rem 4rem;text-align:center}.topmost{margin:1rem}.header,header{background-color:#20202e;border-bottom:.2rem solid #2e2e42;height:4rem;margin:0 0 1rem;padding:0;position:static}.header.sticky,header.sticky{margin:0;position:sticky;top:0;z-index:100}header>.nav{align-items:center;display:flex;gap:1rem;margin:0 1rem}.nav>div{border-bottom:.2rem solid #20202e}.nav>div.current{border-bottom:.2rem solid #b899ff}.nav>div.current>a{color:#b899ff}.footer,footer{border-top:.2rem solid #2e2e42;margin:4rem 1rem;padding:4rem 1rem 1rem;text-align:center}table{border:.2rem solid #2e2e42;border-collapse:separate;border-radius:.8rem;border-spacing:0}td{font-weight:400}td,th{padding:1rem;text-align:left}th{font-weight:700}table.outer tbody,table.outer td,table.outer tfoot,table.outer th,table.outer thead{border:none}table.inner td:not(:last-child),table.inner th:not(:last-child){border-right:.2rem solid #2e2e42}table.inner>tbody:not(:last-child),table.inner>tbody>tr:not(:last-child)>td,table.inner>tbody>tr:not(:last-child)>th,table.inner>thead:not(:last-child),table.inner>thead>tr>td,table.inner>thead>tr>th,table.inner>tr:not(:last-child)>td,table.inner>tr:not(:last-child)>th{border-bottom:.2rem solid #2e2e42}.a,a{border-radius:.4rem;color:#9466ff;cursor:pointer;font-size:1rem;line-height:1.4;text-decoration:none;transition-duration:.4s}.a:focus-visible,.a:hover,a:focus-visible,a:hover{color:#b899ff}.a:focus-visible,a:focus-visible{outline:.2rem solid #9466ff;outline-offset:.4rem;transition-duration:.1s}.button,button{align-items:flex-start;appearance:none;background-color:#9466ff;border:.2rem solid #9466ff;border-radius:2rem;box-sizing:border-box;color:#20202e;cursor:pointer;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;font-weight:600;line-height:1.4;padding:.4rem .8rem;text-align:center;text-decoration:none;transition-duration:.4s}.button.alt,button.alt{background-color:#2b2b3d;border-color:#2b2b3d;color:#9466ff}.button:focus-visible,.button:hover,button:focus-visible,button:hover{background-color:#b899ff;color:#20202e}.button:focus-visible,button:focus-visible{outline:.2rem solid #9466ff;outline-offset:.2rem;transition-duration:.1s}::placeholder{color:#9399b2;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;opacity:1}input[type=password],input[type=text],textarea{align-items:flex-start;appearance:none;background-color:#20202e;border:.2rem solid #2e2e42;border-radius:.8rem;box-sizing:border-box;color:#c3cce9;cursor:text;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;line-height:1.4;outline:none;padding:.4rem .8rem;text-align:left;text-decoration:none;transition-duration:.4s}input[type=password]:hover,input[type=text]:hover,textarea:hover{border-color:#b899ff}input[type=password]:focus,input[type=password]:focus-visible,input[type=text]:focus,input[type=text]:focus-visible,textarea:focus,textarea:focus-visible{border-color:#9466ff}.checkbox,.radio{display:grid;gap:1em;grid-template-areas:"input label .";grid-template-columns:1.8rem auto 1fr}.checkbox input,.radio input{grid-area:input}.checkbox label,.radio label{grid-area:label}input[type=checkbox],input[type=radio]{appearance:none;background-color:#20202e;border:.2rem solid #9466ff;height:1.8rem;margin:0;transition-duration:.4s;width:1.8rem}input[type=radio]{border-radius:50%}input[type=checkbox]{border-radius:.6rem}input[type=checkbox]:focus-visible,input[type=checkbox]:hover,input[type=radio]:focus-visible,input[type=radio]:hover{border-color:#b899ff}input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline:.2rem solid #9466ff;outline-offset:.2rem;transition-duration:.1s}input[type=checkbox]:checked,input[type=radio]:checked{background-color:#9466ff;transition-duration:.1s}.card{height:20rem;width:40rem}.caption{display:grid;gap:1rem;grid-template-rows:1fr;width:40rem}.caption.centerThree{grid-template-columns:1fr 4fr 1fr}.caption.evenTwo{grid-template-columns:1fr 1fr}.caption.evenThree{grid-template-columns:1fr 1fr 1fr}@media only screen and (max-width:800px){.caption,.card{width:100%}}.card>.content{align-items:center;background-color:#242433;border-radius:.8rem;display:flex;height:100%;justify-content:center;position:relative;text-align:center;width:100%}.card.double{perspective:1000px}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:preserve-3d;transition:transform .4s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;background-color:#242433;border-radius:.8rem;box-shadow:0 4px 10px 2px rgba(0,0,0,.1);display:flex;height:100%;justify-content:center;margin-top:0;position:absolute;text-align:center;transform:rotateX(0deg);width:100%}.card.double.flip>.content,.card.double>.content>.back{transform:rotateY(180deg)}.separator{align-items:center;color:#9399b2;display:flex;justify-content:center}.separator:after,.separator:before{background:#2e2e42;content:"";display:block;height:.2rem;margin:0 1rem;width:100%}.modal{align-items:center;display:flex;justify-content:center;z-index:200}.modal,.modal:before{height:100vh;left:0;position:fixed;top:0;width:100vw}.modal:before{background-color:#1b1b26;content:"";opacity:.6;z-index:180}.modal>.content{background-color:#20202e;border:.2rem solid #2e2e42;border-radius:.8rem;padding:1rem;width:60vw;z-index:200}@media only screen and (max-width:800px){.modal{align-items:flex-end}.modal>.content{border:none;border-radius:0;border-top:.2rem solid #2e2e42;padding-bottom:8rem;width:100vw}}.flex.pop{padding:0 1rem}.dropdown{display:inline-block;position:relative}.dropdown .content{align-items:stretch;background:#242433;border:.2rem solid #2e2e42;border-radius:.8rem;display:none;flex-direction:column;gap:.4rem;margin-top:.4rem;padding:.4rem;position:absolute;z-index:1}.dropdown:focus-within .content{display:flex}.dropdown .content .button,.dropdown .content button{background-color:#242433;border-color:#242433;color:#9466ff;margin-top:0;text-wrap:nowrap}.dropdown .content .button:focus-visible,.dropdown .content .button:hover,.dropdown .content button:focus-visible,.dropdown .content button:hover{background-color:#2b2b3d;border-color:#2b2b3d;color:#b899ff}.button.dropdown-toggle,button.dropdown-toggle{background-color:transparent;border:none;color:#c3cce9}.button.dropdown-toggle:focus-visible,.button.dropdown-toggle:hover,button.dropdown-toggle:focus-visible,button.dropdown-toggle:hover{background-color:#2b2b3d;border:none;color:#b899ff}*,:after,:before{box-sizing:border-box}.center{text-align:center}.flex{display:flex;flex-wrap:wrap;gap:1rem}.flex.row{flex-direction:row}.flex.row.rev{flex-direction:row-reverse}.flex.col{flex-direction:column}.flex.col.rev{flex-direction:column-reverse}.flex.no-wrap,.flex.nowrap{flex-wrap:nowrap}.flex.wrap{flex-wrap:wrap}.flex.start{justify-content:flex-start}.flex.end{justify-content:flex-end}.flex.center{justify-content:center}.flex.spaceBetween{justify-content:space-between}.flex.alignStart{align-content:flex-start;align-items:flex-start}.flex.alignEnd{align-content:flex-end;align-items:flex-end}.flex.alignCenter,.flex.center-v{align-content:center;align-items:center}.flex.center-h{justify-content:center;justify-items:center}.flex.stretch{align-content:stretch;align-items:stretch}.flex.alignSpaceBetween{align-content:space-between;align-items:space-between}.flex.alignSpaceAround{align-content:space-around;align-items:space-around}.justifyselfstretch{justify-self:stretch}.justifyselfcenter{justify-self:center}.justifyselfstart{justify-self:start}.justifyselfend{justify-self:end}.grid{display:grid}.grid.split{gap:0;grid-template-areas:"left right";grid-template-columns:4fr 4fr;grid-template-rows:1fr}.grid.split>.left{grid-area:left;justify-self:right;padding-right:2rem}.grid.split>.right{border-left:.2rem solid #2e2e42;grid-area:right;justify-self:left;padding-left:2rem}.grid.split.noBorder>.left,.grid.split.noBorder>.right{border:none}@media only screen and (max-width:800px){.grid.split{grid-template-areas:"left" "right";grid-template-columns:1fr;grid-template-rows:auto auto;padding:0 2rem}.grid.split>.left,.grid.split>.right{border:none;justify-self:left;padding-left:0;padding-right:0}}.grid.list{gap:1rem;grid-template-columns:1fr 1fr 1fr;margin-bottom:2rem}.grid.split .grid.list{grid-template-columns:1fr}@media only screen and (max-width:800px){.grid.list{grid-template-columns:1fr}}.grid.hero{grid-template-areas:"content . logo";grid-template-columns:6fr 2fr 6fr;grid-template-rows:1fr}.grid.hero>.content{align-self:center;grid-area:content;justify-self:end;text-align:center}.grid.hero>.logo{align-self:center;grid-area:logo;justify-self:start}@media only screen and (max-width:800px){.grid.hero{grid-template-areas:"logo" "content";grid-template-columns:1fr;grid-template-rows:1fr 1fr}.grid.hero>.content,.grid.hero>.logo{justify-self:center}}.grid.intro{border-bottom:.2rem solid #2e2e42;gap:4rem;grid-template-areas:"logotype actions" "content content";grid-template-columns:1fr 1fr;grid-template-rows:auto auto;margin:0 1rem 4rem;padding:1rem 2rem 4rem}.grid.intro>.logotype{align-items:center;display:flex;gap:1rem;grid-area:logotype;justify-content:start;justify-items:start}.grid.intro>.logotype p{margin-bottom:0}.grid.intro>.logotype>.logo{height:4rem;width:4rem}.grid.intro>.content{grid-area:content;text-align:center}@media only screen and (max-width:800px){.grid.intro{padding-left:1rem;padding-right:1rem}}.grid.page{grid-template-areas:". content .";grid-template-columns:2fr 10fr 2fr;grid-template-rows:1fr}.grid.page>.content{align-self:start;grid-area:content;justify-self:stretch}@media only screen and (max-width:800px){.grid.page{grid-template-columns:1fr 12fr 1fr}}.grid.screen{height:100%;margin:0 1rem}.grid.screen>.content{align-self:center;justify-self:center;margin-top:0}html.screen{height:100%}html.screen body{display:grid;grid-template-rows:auto 1fr;height:100%}header{display:grid;gap:1rem;grid-template-areas:"menu";grid-template-columns:1fr}header>.menu{grid-area:menu;justify-self:left;text-align:left}header>.options{grid-area:options;justify-self:right;padding:1rem;text-align:right}.nav>div{align-items:center;display:flex;height:100%}*+*,*+h1,*+h2,*+h3,*+h4,*+h5,*+h6,*+p{margin-top:1rem}.caption>*,.caption>div>*,.checkbox>*,.flex>*,.grid>*,.logotype>*,.nav>div,.radio>*,header>*{margin-top:0}.grid.paragraph{gap:1rem;grid-template-areas:"content image";grid-template-columns:1fr 1fr}.grid.paragraph.alt{grid-template-areas:"image content"}.grid.paragraph>.content{grid-area:content}.grid.paragraph>.image{align-items:center;display:flex;grid-area:image;justify-items:center}@media only screen and (max-width:1000px){.grid.paragraph,.grid.paragraph.alt{gap:1rem;grid-template-areas:"content" "image";grid-template-columns:1fr;grid-template-rows:1fr auto}}a.mark{color:#9466ff}a.mark:focus-visible,a.mark:hover{color:#b899ff}.mark.ohno,.text.ohno,b.ohno,code.ohno,i.ohno,mark.ohno,p.ohno,span.ohno,u.ohno{color:#f66}.mark.yay,.text.yay,b.yay,code.yay,i.yay,mark.yay,p.yay,span.yay,u.yay{color:#6fc}.mark.bg1,.text.bg1,b.bg1,code.bg1,i.bg1,mark.bg1,p.bg1,span.bg1,u.bg1{color:#20202e}.mark.fg1,.mark.fg2,.text.fg1,.text.fg2,b.fg1,b.fg2,code.fg1,code.fg2,i.fg1,i.fg2,mark.fg1,mark.fg2,p.fg1,p.fg2,span.fg1,span.fg2,u.fg1,u.fg2{color:#c3cce9}.mark.fg0,.text.fg0,b.fg0,code.fg0,i.fg0,mark.fg0,p.fg0,span.fg0,u.fg0{color:#9399b2}.mark.main,.text.main,b.main,code.main,i.main,mark.main,p.main,span.main,u.main{color:#9466ff}.mark.extra,.text.extra,b.extra,code.extra,i.extra,mark.extra,p.extra,span.extra,u.extra{color:#6fc}.mark.markOhno,mark.markOhno{background-color:#f66}.mark.markYay,mark.markYay{background-color:#6fc}.mark.markBg4,mark.markBg4{background-color:#2e2e42}.mark.markBg2,mark.markBg2{background-color:#242433}.mark.markFg1,.mark.markFg2,mark.markFg1,mark.markFg2{background-color:#c3cce9}.mark.markFg0,mark.markFg0{background-color:#9399b2}.mark.markMain,mark.markMain{background-color:#9466ff}.mark.markExtra,mark.markExtra{background-color:#6fc}.box.ohno{border-color:#f66;color:#f66}.box.yay{border-color:#6fc;color:#6fc}.pre,pre{white-space:pre}.button.ohno,button.ohno{background-color:#f66;border-color:#f66}.button.extra,.button.yay,button.extra,button.yay{background-color:#6fc;border-color:#6fc}.button.extra,button.extra{color:#1b1b26}.button.alt.ohno,button.alt.ohno{background-color:#2b2b3d;border-color:#2b2b3d;color:#f66}.button.alt.extra,.button.alt.yay,button.alt.extra,button.alt.yay{background-color:#2b2b3d;border-color:#2b2b3d;color:#6fc}.button:focus-visible.ohno,.button:hover.ohno,button:focus-visible.ohno,button:hover.ohno{background-color:#f99;color:#20202e}.button:focus-visible.yay,.button:hover.yay,button:focus-visible.yay,button:hover.yay{background-color:#cfe;color:#20202e}.button:focus-visible.extra,.button:hover.extra,button:focus-visible.extra,button:hover.extra{background-color:#cfe;color:#1b1b26}.button:focus-visible.ohno,button:focus-visible.ohno{outline-color:#f66}.button:focus-visible.yay,button:focus-visible.yay{outline-color:#6fc}.button:focus-visible.extra,button:focus-visible.extra{outline-color:#6fc}input[type=password].ohno:hover,input[type=text].ohno:hover,textarea.ohno:hover{border-color:#f99}input[type=password].extra:hover,input[type=password].yay:hover,input[type=text].extra:hover,input[type=text].yay:hover,textarea.extra:hover,textarea.yay:hover{border-color:#cfe}input[type=password].ohno:focus,input[type=password].ohno:focus-visible,input[type=text].ohno:focus,input[type=text].ohno:focus-visible,textarea.ohno:focus,textarea.ohno:focus-visible{border-color:#f66}input[type=password].yay:focus,input[type=password].yay:focus-visible,input[type=text].yay:focus,input[type=text].yay:focus-visible,textarea.yay:focus,textarea.yay:focus-visible{border-color:#6fc}input[type=password].extra:focus,input[type=password].extra:focus-visible,input[type=text].extra:focus,input[type=text].extra:focus-visible,textarea.extra:focus,textarea.extra:focus-visible{border-color:#6fc}textarea.vertical{resize:vertical;white-space:pre}textarea.horizontal{resize:horizontal;white-space:pre}.hide{display:none}.fullscreen{align-items:center;background:#20202e;display:flex;height:100vh;justify-content:center;left:0;margin:0;position:fixed;top:0;width:100vw;z-index:200}.exitFullscreen{display:none;left:1rem;margin:0;position:fixed;top:1rem}.fullscreen>.button.exitFullscreen,.fullscreen>button.exitFullscreen{display:inline-block}.invisible{height:1px;margin:0;opacity:0;overflow:hidden;position:absolute;width:1px}.hero>.logo:before{background-color:#9466ff;border-radius:50%;content:"";filter:blur(1rem);height:200px;opacity:.2;position:absolute;width:200px;z-index:-100}html.min .hero>.logo:before{display:none}.hero>.logo>svg{margin-top:0}.fullWidth{width:100%}.grid.page.extra{background-color:#1b1b26;margin-bottom:0;margin-top:0;padding-bottom:1rem}.button.large,button.large{font-size:1.2rem;line-height:1.6rem;padding:.6rem 1.2rem}.fill-ohno{fill:#f66}.fill-ohno-alt{fill:#f99}.fill-yay{fill:#6fc}.fill-yay-alt{fill:#cfe}.fill-main{fill:#9466ff}.fill-main-alt{fill:#b899ff}.fill-extra{fill:#6fc}.fill-extra-alt{fill:#cfe}.fill-extra-bg{fill:#1b1b26}.fill-fg1,.fill-fg2{fill:#c3cce9}.fill-fg0{fill:#9399b2}.fill-bg4{fill:#2e2e42}.fill-bg3{fill:#2b2b3d}.fill-bg2{fill:#242433}.fill-bg1{fill:#20202e}.fill-bg0{fill:#1b1b26}.background-extra-bg{background-color:#1b1b26}.background-bg2{background-color:#242433}.background-bg1{background-color:#20202e}.background-bg0{background-color:#1b1b26}.dropdown .content .button.ohno,.dropdown .content button.ohno{background-color:#242433;border-color:#242433;color:#f66}.dropdown .content .button.yay,.dropdown .content button.yay{background-color:#242433;border-color:#242433;color:#6fc}.dropdown .content .button.ohno:focus-visible,.dropdown .content .button.ohno:hover,.dropdown .content button.ohno:focus-visible,.dropdown .content button.ohno:hover{background-color:#2b2b3d;border-color:#2b2b3d;color:#f99}.dropdown .content .button.yay:focus-visible,.dropdown .content .button.yay:hover,.dropdown .content button.yay:focus-visible,.dropdown .content button.yay:hover{background-color:#2b2b3d;border-color:#2b2b3d;color:#cfe}@media (prefers-reduced-motion){html{scroll-behavior:auto}.a,.button,a,button,input[type=checkbox],input[type=password],input[type=radio],input[type=text],textarea{transition-duration:0s}.card,.card.double{perspective:none}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:flat;transition-duration:0s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:visible;-webkit-backface-visibility:visible;-moz-backface-visibility:visible;background-color:#242433;border-radius:.8rem;height:100%;justify-content:center;position:absolute;text-align:center;transform:none;width:100%}.card.double>.content>.back{display:none;transform:none}.card.double>.content>.front{display:flex}.card.double.flip>.content{transform:none}.card.double.flip>.content>.back{display:flex}.card.double.flip>.content>.front{display:none}} \ No newline at end of file +*/:root{color-scheme:dark}html{font-size:18px;height:auto;scroll-behavior:smooth}@media only screen and (max-width:800px){html{font-size:16px}}body{background-color:#20202e;color:#c3cce9;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;height:auto;line-height:1.4;margin:0}::selection{background-color:#533380;color:#c3cce9}.h1,h1{font-size:3.4rem}.h1,.h2,h1,h2{font-weight:700;margin-bottom:1rem;margin-top:0}.h2,h2{font-size:2.8rem}.h3,h3{font-size:2.2rem}.h3,.h4,h3,h4{font-weight:700;margin-bottom:1rem;margin-top:0}.h4,h4{font-size:1.6rem}.h1,.h2,.h3,.h4,h1,h2,h3,h4{line-height:1.2}.h5,h5,p{font-size:1rem;font-weight:400;margin-bottom:1rem;margin-top:0}p{margin-block-end:0}.h6,h6,small{font-size:.8rem;font-weight:400;margin-bottom:1rem}.h5,.h6,h5,h6,p,small{line-height:1.4}.b,b{font-weight:700}.i,i{font-style:italic}i.nf{font-style:normal}.s,s{text-decoration:line-through}.mark,mark{background-color:#c3cce9;color:#20202e}.code,.mark,code,mark{border-radius:.4rem;font-size:1rem;line-height:1.4;padding:.2rem .4rem}.code,code{font-family:monospace}.box,.code,code{background-color:#242433}.box{border:.2rem solid #242433;border-radius:.8rem;color:#c3cce9;padding:1rem}.hero{border-bottom:.2rem solid #2e2e42;margin:4rem 1rem;padding:1rem 1rem 4rem;text-align:center}.topmost{margin:1rem}.header,header{background-color:#20202e;border-bottom:.2rem solid #2e2e42;height:4rem;margin:0 0 1rem;padding:0;position:static}.header.sticky,header.sticky{margin:0;position:sticky;top:0;z-index:100}header>.nav{align-items:center;display:flex;gap:1rem;margin:0 1rem}.nav>div{border-bottom:.2rem solid #20202e}.nav>div.current{border-bottom:.2rem solid #b899ff}.nav>div.current>a{color:#b899ff}.footer,footer{border-top:.2rem solid #2e2e42;margin:4rem 1rem;padding:4rem 1rem 1rem;text-align:center}table{border:.2rem solid #2e2e42;border-collapse:separate;border-radius:.8rem;border-spacing:0}td{font-weight:400}td,th{padding:1rem;text-align:left}th{font-weight:700}table.outer tbody,table.outer td,table.outer tfoot,table.outer th,table.outer thead{border:none}table.inner td:not(:last-child),table.inner th:not(:last-child){border-right:.2rem solid #2e2e42}table.inner>tbody:not(:last-child),table.inner>tbody>tr:not(:last-child)>td,table.inner>tbody>tr:not(:last-child)>th,table.inner>thead:not(:last-child),table.inner>thead>tr>td,table.inner>thead>tr>th,table.inner>tr:not(:last-child)>td,table.inner>tr:not(:last-child)>th{border-bottom:.2rem solid #2e2e42}.a,a{border-radius:.4rem;color:#9466ff;cursor:pointer;font-size:1rem;line-height:1.4;text-decoration:none;transition-duration:.4s}.a:focus-visible,.a:hover,a:focus-visible,a:hover{color:#b899ff}.a:focus-visible,a:focus-visible{outline:.2rem solid #9466ff;outline-offset:.4rem;transition-duration:.1s}.button,button{align-items:flex-start;appearance:none;background-color:#9466ff;border:.2rem solid #9466ff;border-radius:2rem;box-sizing:border-box;color:#20202e;cursor:pointer;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;font-weight:600;line-height:1.4;padding:.4rem .8rem;text-align:center;text-decoration:none;transition-duration:.4s}.button.alt,button.alt{background-color:#2b2b3d;border-color:#2b2b3d;color:#9466ff}.button:focus-visible,.button:hover,button:focus-visible,button:hover{background-color:#b899ff;color:#20202e}.button:focus-visible,button:focus-visible{outline:.2rem solid #9466ff;outline-offset:.2rem;transition-duration:.1s}::placeholder{color:#9399b2;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;opacity:1}input[type=password],input[type=text],textarea{align-items:flex-start;appearance:none;background-color:#20202e;border:.2rem solid #2e2e42;border-radius:.8rem;box-sizing:border-box;color:#c3cce9;cursor:text;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;line-height:1.4;outline:none;padding:.4rem .8rem;text-align:left;text-decoration:none;transition-duration:.4s}input[type=password]:hover,input[type=text]:hover,textarea:hover{border-color:#b899ff}input[type=password]:focus,input[type=password]:focus-visible,input[type=text]:focus,input[type=text]:focus-visible,textarea:focus,textarea:focus-visible{border-color:#9466ff}.checkbox,.radio{display:grid;gap:1em;grid-template-areas:"input label .";grid-template-columns:1.8rem auto 1fr}.checkbox input,.radio input{grid-area:input}.checkbox label,.radio label{grid-area:label}input[type=checkbox],input[type=radio]{appearance:none;background-color:#20202e;border:.2rem solid #9466ff;height:1.8rem;margin:0;transition-duration:.4s;width:1.8rem}input[type=radio]{border-radius:50%}input[type=checkbox]{border-radius:.6rem}input[type=checkbox]:focus-visible,input[type=checkbox]:hover,input[type=radio]:focus-visible,input[type=radio]:hover{border-color:#b899ff}input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline:.2rem solid #9466ff;outline-offset:.2rem;transition-duration:.1s}input[type=checkbox]:checked,input[type=radio]:checked{background-color:#9466ff;transition-duration:.1s}.card{height:20rem;width:40rem}.caption{display:grid;gap:1rem;grid-template-rows:1fr;width:40rem}.caption.centerThree{grid-template-columns:1fr 4fr 1fr}.caption.evenTwo{grid-template-columns:1fr 1fr}.caption.evenThree{grid-template-columns:1fr 1fr 1fr}@media only screen and (max-width:800px){.caption,.card{width:100%}}.card>.content{align-items:center;background-color:#242433;border-radius:.8rem;display:flex;height:100%;justify-content:center;position:relative;text-align:center;width:100%}.card.double{perspective:1000px}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:preserve-3d;transition:transform .4s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;background-color:#242433;border-radius:.8rem;box-shadow:0 4px 10px 2px rgba(0,0,0,.1);display:flex;height:100%;justify-content:center;margin-top:0;position:absolute;text-align:center;transform:rotateX(0deg);width:100%}.card.double.flip>.content,.card.double>.content>.back{transform:rotateY(180deg)}.separator{align-items:center;color:#9399b2;display:flex;justify-content:center}.separator:after,.separator:before{background:#2e2e42;content:"";display:block;height:.2rem;margin:0 1rem;width:100%}.modal{align-items:center;display:flex;justify-content:center;z-index:200}.modal,.modal:before{height:100vh;left:0;position:fixed;top:0;width:100vw}.modal:before{background-color:#1b1b26;content:"";opacity:.6;z-index:180}.modal>.content{background-color:#20202e;border:.2rem solid #2e2e42;border-radius:.8rem;padding:1rem;width:60vw;z-index:200}@media only screen and (max-width:800px){.modal{align-items:flex-end}.modal>.content{border:none;border-radius:0;border-top:.2rem solid #2e2e42;padding-bottom:8rem;width:100vw}}.flex.pop{padding:0 1rem}.dropdown{display:inline-block;position:relative}.dropdown .content{align-items:stretch;background:#242433;border:.2rem solid #2e2e42;border-radius:.8rem;display:none;flex-direction:column;gap:.4rem;margin-top:.4rem;padding:.4rem;position:absolute;z-index:1}.dropdown:focus-within .content{display:flex}.dropdown .content .button,.dropdown .content button{background-color:#242433;border-color:#242433;color:#9466ff;margin-top:0;text-wrap:nowrap}.dropdown .content .button:focus-visible,.dropdown .content .button:hover,.dropdown .content button:focus-visible,.dropdown .content button:hover{background-color:#2b2b3d;border-color:#2b2b3d;color:#b899ff}.button.dropdown-toggle,.button.icon-only-button,button.dropdown-toggle,button.icon-only-button{background-color:transparent;border:none;color:#c3cce9}.button.dropdown-toggle:focus-visible,.button.dropdown-toggle:hover,.button.icon-only-button:focus-visible,.button.icon-only-button:hover,button.dropdown-toggle:focus-visible,button.dropdown-toggle:hover,button.icon-only-button:focus-visible,button.icon-only-button:hover{background-color:#2b2b3d;border:none;color:#b899ff}*,:after,:before{box-sizing:border-box}.center{text-align:center}.flex{display:flex;flex-wrap:wrap;gap:1rem}.flex.row{flex-direction:row}.flex.row.rev{flex-direction:row-reverse}.flex.col{flex-direction:column}.flex.col.rev{flex-direction:column-reverse}.flex.no-wrap,.flex.nowrap{flex-wrap:nowrap}.flex.wrap{flex-wrap:wrap}.flex.start{justify-content:flex-start}.flex.end{justify-content:flex-end}.flex.center{justify-content:center}.flex.spaceBetween{justify-content:space-between}.flex.alignStart{align-content:flex-start;align-items:flex-start}.flex.alignEnd{align-content:flex-end;align-items:flex-end}.flex.alignCenter,.flex.center-v{align-content:center;align-items:center}.flex.center-h{justify-content:center;justify-items:center}.flex.stretch{align-content:stretch;align-items:stretch}.flex.alignSpaceBetween{align-content:space-between;align-items:space-between}.flex.alignSpaceAround{align-content:space-around;align-items:space-around}.justifyselfstretch{justify-self:stretch}.justifyselfcenter{justify-self:center}.justifyselfstart{justify-self:start}.justifyselfend{justify-self:end}.flex.compact-gap{gap:.2rem}.grid{display:grid}.grid.split{gap:0;grid-template-areas:"left right";grid-template-columns:4fr 4fr;grid-template-rows:1fr}.grid.split>.left{grid-area:left;justify-self:right;padding-right:2rem}.grid.split>.right{border-left:.2rem solid #2e2e42;grid-area:right;justify-self:left;padding-left:2rem}.grid.split.noBorder>.left,.grid.split.noBorder>.right{border:none}@media only screen and (max-width:800px){.grid.split{grid-template-areas:"left" "right";grid-template-columns:1fr;grid-template-rows:auto auto;padding:0 2rem}.grid.split>.left,.grid.split>.right{border:none;justify-self:left;padding-left:0;padding-right:0}}.grid.list{gap:1rem;grid-template-columns:1fr 1fr 1fr;margin-bottom:2rem}.grid.split .grid.list{grid-template-columns:1fr}@media only screen and (max-width:800px){.grid.list{grid-template-columns:1fr}}.grid.hero{grid-template-areas:"content . logo";grid-template-columns:6fr 2fr 6fr;grid-template-rows:1fr}.grid.hero>.content{align-self:center;grid-area:content;justify-self:end;text-align:center}.grid.hero>.logo{align-self:center;grid-area:logo;justify-self:start}@media only screen and (max-width:800px){.grid.hero{grid-template-areas:"logo" "content";grid-template-columns:1fr;grid-template-rows:1fr 1fr}.grid.hero>.content,.grid.hero>.logo{justify-self:center}}.grid.intro{border-bottom:.2rem solid #2e2e42;gap:4rem;grid-template-areas:"logotype actions" "content content";grid-template-columns:1fr 1fr;grid-template-rows:auto auto;margin:0 1rem 4rem;padding:1rem 2rem 4rem}.grid.intro>.logotype{align-items:center;display:flex;gap:1rem;grid-area:logotype;justify-content:start;justify-items:start}.grid.intro>.logotype p{margin-bottom:0}.grid.intro>.logotype>.logo{height:4rem;width:4rem}.grid.intro>.content{grid-area:content;text-align:center}@media only screen and (max-width:800px){.grid.intro{padding-left:1rem;padding-right:1rem}}.grid.page{grid-template-areas:". content .";grid-template-columns:2fr 10fr 2fr;grid-template-rows:1fr}.grid.page>.content{align-self:start;grid-area:content;justify-self:stretch}@media only screen and (max-width:800px){.grid.page{grid-template-columns:1fr 12fr 1fr}}.grid.screen{height:100%;margin:0 1rem}.grid.screen>.content{align-self:center;justify-self:center;margin-top:0}html.screen{height:100%}html.screen body{display:grid;grid-template-rows:auto 1fr;height:100%}header{display:grid;gap:1rem;grid-template-areas:"menu";grid-template-columns:1fr}header>.menu{grid-area:menu;justify-self:left;text-align:left}header>.options{grid-area:options;justify-self:right;padding:1rem;text-align:right}.nav>div{align-items:center;display:flex;height:100%}*+*,*+h1,*+h2,*+h3,*+h4,*+h5,*+h6,*+p{margin-top:1rem}.caption>*,.caption>div>*,.checkbox>*,.flex>*,.grid>*,.logotype>*,.nav>div,.radio>*,header>*{margin-top:0}.grid.paragraph{gap:1rem;grid-template-areas:"content image";grid-template-columns:1fr 1fr}.grid.paragraph.alt{grid-template-areas:"image content"}.grid.paragraph>.content{grid-area:content}.grid.paragraph>.image{align-items:center;display:flex;grid-area:image;justify-items:center}@media only screen and (max-width:1000px){.grid.paragraph,.grid.paragraph.alt{gap:1rem;grid-template-areas:"content" "image";grid-template-columns:1fr;grid-template-rows:1fr auto}}a.mark{color:#9466ff}a.mark:focus-visible,a.mark:hover{color:#b899ff}.mark.ohno,.text.ohno,b.ohno,code.ohno,i.ohno,mark.ohno,p.ohno,span.ohno,u.ohno{color:#f66}.mark.yay,.text.yay,b.yay,code.yay,i.yay,mark.yay,p.yay,span.yay,u.yay{color:#6fc}.mark.bg1,.text.bg1,b.bg1,code.bg1,i.bg1,mark.bg1,p.bg1,span.bg1,u.bg1{color:#20202e}.mark.fg1,.mark.fg2,.text.fg1,.text.fg2,b.fg1,b.fg2,code.fg1,code.fg2,i.fg1,i.fg2,mark.fg1,mark.fg2,p.fg1,p.fg2,span.fg1,span.fg2,u.fg1,u.fg2{color:#c3cce9}.mark.fg0,.text.fg0,b.fg0,code.fg0,i.fg0,mark.fg0,p.fg0,span.fg0,u.fg0{color:#9399b2}.mark.main,.text.main,b.main,code.main,i.main,mark.main,p.main,span.main,u.main{color:#9466ff}.mark.extra,.text.extra,b.extra,code.extra,i.extra,mark.extra,p.extra,span.extra,u.extra{color:#6fc}.mark.markOhno,mark.markOhno{background-color:#f66}.mark.markYay,mark.markYay{background-color:#6fc}.mark.markBg4,mark.markBg4{background-color:#2e2e42}.mark.markBg2,mark.markBg2{background-color:#242433}.mark.markFg1,.mark.markFg2,mark.markFg1,mark.markFg2{background-color:#c3cce9}.mark.markFg0,mark.markFg0{background-color:#9399b2}.mark.markMain,mark.markMain{background-color:#9466ff}.mark.markExtra,mark.markExtra{background-color:#6fc}.box.ohno{border-color:#f66;color:#f66}.box.yay{border-color:#6fc;color:#6fc}.pre,pre{white-space:pre}.button.ohno,button.ohno{background-color:#f66;border-color:#f66}.button.extra,.button.yay,button.extra,button.yay{background-color:#6fc;border-color:#6fc}.button.extra,button.extra{color:#1b1b26}.button.alt.ohno,button.alt.ohno{background-color:#2b2b3d;border-color:#2b2b3d;color:#f66}.button.alt.extra,.button.alt.yay,button.alt.extra,button.alt.yay{background-color:#2b2b3d;border-color:#2b2b3d;color:#6fc}.button:focus-visible.ohno,.button:hover.ohno,button:focus-visible.ohno,button:hover.ohno{background-color:#f99;color:#20202e}.button:focus-visible.yay,.button:hover.yay,button:focus-visible.yay,button:hover.yay{background-color:#cfe;color:#20202e}.button:focus-visible.extra,.button:hover.extra,button:focus-visible.extra,button:hover.extra{background-color:#cfe;color:#1b1b26}.button:focus-visible.ohno,button:focus-visible.ohno{outline-color:#f66}.button:focus-visible.yay,button:focus-visible.yay{outline-color:#6fc}.button:focus-visible.extra,button:focus-visible.extra{outline-color:#6fc}input[type=password].ohno:hover,input[type=text].ohno:hover,textarea.ohno:hover{border-color:#f99}input[type=password].extra:hover,input[type=password].yay:hover,input[type=text].extra:hover,input[type=text].yay:hover,textarea.extra:hover,textarea.yay:hover{border-color:#cfe}input[type=password].ohno:focus,input[type=password].ohno:focus-visible,input[type=text].ohno:focus,input[type=text].ohno:focus-visible,textarea.ohno:focus,textarea.ohno:focus-visible{border-color:#f66}input[type=password].yay:focus,input[type=password].yay:focus-visible,input[type=text].yay:focus,input[type=text].yay:focus-visible,textarea.yay:focus,textarea.yay:focus-visible{border-color:#6fc}input[type=password].extra:focus,input[type=password].extra:focus-visible,input[type=text].extra:focus,input[type=text].extra:focus-visible,textarea.extra:focus,textarea.extra:focus-visible{border-color:#6fc}textarea.vertical{resize:vertical;white-space:pre}textarea.horizontal{resize:horizontal;white-space:pre}.hide{display:none}.fullscreen{align-items:center;background:#20202e;display:flex;height:100vh;justify-content:center;left:0;margin:0;position:fixed;top:0;width:100vw;z-index:200}.exitFullscreen{display:none;left:1rem;margin:0;position:fixed;top:1rem}.fullscreen>.button.exitFullscreen,.fullscreen>button.exitFullscreen{display:inline-block}.invisible{height:1px;margin:0;opacity:0;overflow:hidden;position:absolute;width:1px}.hero>.logo:before{background-color:#9466ff;border-radius:50%;content:"";filter:blur(1rem);height:200px;opacity:.2;position:absolute;width:200px;z-index:-100}html.min .hero>.logo:before{display:none}.hero>.logo>svg{margin-top:0}.fullWidth{width:100%}.grid.page.extra{background-color:#1b1b26;margin-bottom:0;margin-top:0;padding-bottom:1rem}.button.large,button.large{font-size:1.2rem;line-height:1.6rem;padding:.6rem 1.2rem}.fill-ohno{fill:#f66}.fill-ohno-alt{fill:#f99}.fill-yay{fill:#6fc}.fill-yay-alt{fill:#cfe}.fill-main{fill:#9466ff}.fill-main-alt{fill:#b899ff}.fill-extra{fill:#6fc}.fill-extra-alt{fill:#cfe}.fill-extra-bg{fill:#1b1b26}.fill-fg1,.fill-fg2{fill:#c3cce9}.fill-fg0{fill:#9399b2}.fill-bg4{fill:#2e2e42}.fill-bg3{fill:#2b2b3d}.fill-bg2{fill:#242433}.fill-bg1{fill:#20202e}.fill-bg0{fill:#1b1b26}.background-extra-bg{background-color:#1b1b26}.background-bg2{background-color:#242433}.background-bg1{background-color:#20202e}.background-bg0{background-color:#1b1b26}.dropdown .content .button.ohno,.dropdown .content button.ohno{background-color:#242433;border-color:#242433;color:#f66}.dropdown .content .button.yay,.dropdown .content button.yay{background-color:#242433;border-color:#242433;color:#6fc}.dropdown .content .button.ohno:focus-visible,.dropdown .content .button.ohno:hover,.dropdown .content button.ohno:focus-visible,.dropdown .content button.ohno:hover{background-color:#2b2b3d;border-color:#2b2b3d;color:#f99}.dropdown .content .button.yay:focus-visible,.dropdown .content .button.yay:hover,.dropdown .content button.yay:focus-visible,.dropdown .content button.yay:hover{background-color:#2b2b3d;border-color:#2b2b3d;color:#cfe}.button.dropdown-toggle.ohno,.button.icon-only-button.ohno,button.dropdown-toggle.ohno,button.icon-only-button.ohno{background-color:transparent;border:none;color:#f66}.button.dropdown-toggle.ohno:focus-visible,.button.dropdown-toggle.ohno:hover,.button.icon-only-button.ohno:focus-visible,.button.icon-only-button.ohno:hover,button.dropdown-toggle.ohno:focus-visible,button.dropdown-toggle.ohno:hover,button.icon-only-button.ohno:focus-visible,button.icon-only-button.ohno:hover{background-color:#2b2b3d;border:none;color:#f99}.button.dropdown-toggle.yay,.button.icon-only-button.yay,button.dropdown-toggle.yay,button.icon-only-button.yay{background-color:transparent;border:none;color:#6fc}.button.dropdown-toggle.yay:focus-visible,.button.dropdown-toggle.yay:hover,.button.icon-only-button.yay:focus-visible,.button.icon-only-button.yay:hover,button.dropdown-toggle.yay:focus-visible,button.dropdown-toggle.yay:hover,button.icon-only-button.yay:focus-visible,button.icon-only-button.yay:hover{background-color:#2b2b3d;border:none;color:#cfe}@media (prefers-reduced-motion){html{scroll-behavior:auto}.a,.button,a,button,input[type=checkbox],input[type=password],input[type=radio],input[type=text],textarea{transition-duration:0s}.card,.card.double{perspective:none}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:flat;transition-duration:0s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:visible;-webkit-backface-visibility:visible;-moz-backface-visibility:visible;background-color:#242433;border-radius:.8rem;height:100%;justify-content:center;position:absolute;text-align:center;transform:none;width:100%}.card.double>.content>.back{display:none;transform:none}.card.double>.content>.front{display:flex}.card.double.flip>.content{transform:none}.card.double.flip>.content>.back{display:flex}.card.double.flip>.content>.front{display:none}} \ No newline at end of file diff --git a/site/css/ehui-light.min.css b/site/css/ehui-light.min.css index b88fafb..c6d3685 100644 --- a/site/css/ehui-light.min.css +++ b/site/css/ehui-light.min.css @@ -2,4 +2,4 @@ EhUI is free and open source Copyright (c) Ehan Ahamed and contributors https://ehan.dev/ehui/LICENSE.txt -*/:root{color-scheme:light}html{font-size:18px;height:auto;scroll-behavior:smooth}@media only screen and (max-width:800px){html{font-size:16px}}body{background-color:#fbfcfc;color:#343a40;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;height:auto;line-height:1.4;margin:0}::selection{background-color:#c499ff;color:#343a40}.h1,h1{font-size:3.4rem}.h1,.h2,h1,h2{font-weight:700;margin-bottom:1rem;margin-top:0}.h2,h2{font-size:2.8rem}.h3,h3{font-size:2.2rem}.h3,.h4,h3,h4{font-weight:700;margin-bottom:1rem;margin-top:0}.h4,h4{font-size:1.6rem}.h1,.h2,.h3,.h4,h1,h2,h3,h4{line-height:1.2}.h5,h5,p{font-size:1rem;font-weight:400;margin-bottom:1rem;margin-top:0}p{margin-block-end:0}.h6,h6,small{font-size:.8rem;font-weight:400;margin-bottom:1rem}.h5,.h6,h5,h6,p,small{line-height:1.4}.b,b{font-weight:700}.i,i{font-style:italic}i.nf{font-style:normal}.s,s{text-decoration:line-through}.mark,mark{background-color:#343a40;color:#fbfcfc}.code,.mark,code,mark{border-radius:.4rem;font-size:1rem;line-height:1.4;padding:.2rem .4rem}.code,code{font-family:monospace}.box,.code,code{background-color:#f0f2f5}.box{border:.2rem solid #f0f2f5;border-radius:.8rem;color:#343a40;padding:1rem}.hero{border-bottom:.2rem solid #e1e2e6;margin:4rem 1rem;padding:1rem 1rem 4rem;text-align:center}.topmost{margin:1rem}.header,header{background-color:#fbfcfc;border-bottom:.2rem solid #e1e2e6;height:4rem;margin:0 0 1rem;padding:0;position:static}.header.sticky,header.sticky{margin:0;position:sticky;top:0;z-index:100}header>.nav{align-items:center;display:flex;gap:1rem;margin:0 1rem}.nav>div{border-bottom:.2rem solid #fbfcfc}.nav>div.current{border-bottom:.2rem solid #6639bf}.nav>div.current>a{color:#6639bf}.footer,footer{border-top:.2rem solid #e1e2e6;margin:4rem 1rem;padding:4rem 1rem 1rem;text-align:center}table{border:.2rem solid #e1e2e6;border-collapse:separate;border-radius:.8rem;border-spacing:0}td{font-weight:400}td,th{padding:1rem;text-align:left}th{font-weight:700}table.outer tbody,table.outer td,table.outer tfoot,table.outer th,table.outer thead{border:none}table.inner td:not(:last-child),table.inner th:not(:last-child){border-right:.2rem solid #e1e2e6}table.inner>tbody:not(:last-child),table.inner>tbody>tr:not(:last-child)>td,table.inner>tbody>tr:not(:last-child)>th,table.inner>thead:not(:last-child),table.inner>thead>tr>td,table.inner>thead>tr>th,table.inner>tr:not(:last-child)>td,table.inner>tr:not(:last-child)>th{border-bottom:.2rem solid #e1e2e6}.a,a{border-radius:.4rem;color:#7c49f2;cursor:pointer;font-size:1rem;line-height:1.4;text-decoration:none;transition-duration:.4s}.a:focus-visible,.a:hover,a:focus-visible,a:hover{color:#6639bf}.a:focus-visible,a:focus-visible{outline:.2rem solid #7c49f2;outline-offset:.4rem;transition-duration:.1s}.button,button{align-items:flex-start;appearance:none;background-color:#7c49f2;border:.2rem solid #7c49f2;border-radius:2rem;box-sizing:border-box;color:#fbfcfc;cursor:pointer;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;font-weight:600;line-height:1.4;padding:.4rem .8rem;text-align:center;text-decoration:none;transition-duration:.4s}.button.alt,button.alt{background-color:#ebedf0;border-color:#ebedf0;color:#7c49f2}.button:focus-visible,.button:hover,button:focus-visible,button:hover{background-color:#6639bf;color:#fbfcfc}.button:focus-visible,button:focus-visible{outline:.2rem solid #7c49f2;outline-offset:.2rem;transition-duration:.1s}::placeholder{color:#868e96;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;opacity:1}input[type=password],input[type=text],textarea{align-items:flex-start;appearance:none;background-color:#fbfcfc;border:.2rem solid #e1e2e6;border-radius:.8rem;box-sizing:border-box;color:#343a40;cursor:text;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;line-height:1.4;outline:none;padding:.4rem .8rem;text-align:left;text-decoration:none;transition-duration:.4s}input[type=password]:hover,input[type=text]:hover,textarea:hover{border-color:#6639bf}input[type=password]:focus,input[type=password]:focus-visible,input[type=text]:focus,input[type=text]:focus-visible,textarea:focus,textarea:focus-visible{border-color:#7c49f2}.checkbox,.radio{display:grid;gap:1em;grid-template-areas:"input label .";grid-template-columns:1.8rem auto 1fr}.checkbox input,.radio input{grid-area:input}.checkbox label,.radio label{grid-area:label}input[type=checkbox],input[type=radio]{appearance:none;background-color:#fbfcfc;border:.2rem solid #7c49f2;height:1.8rem;margin:0;transition-duration:.4s;width:1.8rem}input[type=radio]{border-radius:50%}input[type=checkbox]{border-radius:.6rem}input[type=checkbox]:focus-visible,input[type=checkbox]:hover,input[type=radio]:focus-visible,input[type=radio]:hover{border-color:#6639bf}input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline:.2rem solid #7c49f2;outline-offset:.2rem;transition-duration:.1s}input[type=checkbox]:checked,input[type=radio]:checked{background-color:#7c49f2;transition-duration:.1s}.card{height:20rem;width:40rem}.caption{display:grid;gap:1rem;grid-template-rows:1fr;width:40rem}.caption.centerThree{grid-template-columns:1fr 4fr 1fr}.caption.evenTwo{grid-template-columns:1fr 1fr}.caption.evenThree{grid-template-columns:1fr 1fr 1fr}@media only screen and (max-width:800px){.caption,.card{width:100%}}.card>.content{align-items:center;background-color:#f0f2f5;border-radius:.8rem;display:flex;height:100%;justify-content:center;position:relative;text-align:center;width:100%}.card.double{perspective:1000px}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:preserve-3d;transition:transform .4s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;background-color:#f0f2f5;border-radius:.8rem;box-shadow:0 4px 10px 2px rgba(0,0,0,.1);display:flex;height:100%;justify-content:center;margin-top:0;position:absolute;text-align:center;transform:rotateX(0deg);width:100%}.card.double.flip>.content,.card.double>.content>.back{transform:rotateY(180deg)}.separator{align-items:center;color:#868e96;display:flex;justify-content:center}.separator:after,.separator:before{background:#e1e2e6;content:"";display:block;height:.2rem;margin:0 1rem;width:100%}.modal{align-items:center;display:flex;justify-content:center;z-index:200}.modal,.modal:before{height:100vh;left:0;position:fixed;top:0;width:100vw}.modal:before{background-color:#f0f2f5;content:"";opacity:.6;z-index:180}.modal>.content{background-color:#fbfcfc;border:.2rem solid #e1e2e6;border-radius:.8rem;padding:1rem;width:60vw;z-index:200}@media only screen and (max-width:800px){.modal{align-items:flex-end}.modal>.content{border:none;border-radius:0;border-top:.2rem solid #e1e2e6;padding-bottom:8rem;width:100vw}}.flex.pop{padding:0 1rem}.dropdown{display:inline-block;position:relative}.dropdown .content{align-items:stretch;background:#f0f2f5;border:.2rem solid #e1e2e6;border-radius:.8rem;display:none;flex-direction:column;gap:.4rem;margin-top:.4rem;padding:.4rem;position:absolute;z-index:1}.dropdown:focus-within .content{display:flex}.dropdown .content .button,.dropdown .content button{background-color:#f0f2f5;border-color:#f0f2f5;color:#7c49f2;margin-top:0;text-wrap:nowrap}.dropdown .content .button:focus-visible,.dropdown .content .button:hover,.dropdown .content button:focus-visible,.dropdown .content button:hover{background-color:#ebedf0;border-color:#ebedf0;color:#6639bf}.button.dropdown-toggle,button.dropdown-toggle{background-color:transparent;border:none;color:#343a40}.button.dropdown-toggle:focus-visible,.button.dropdown-toggle:hover,button.dropdown-toggle:focus-visible,button.dropdown-toggle:hover{background-color:#ebedf0;border:none;color:#6639bf}*,:after,:before{box-sizing:border-box}.center{text-align:center}.flex{display:flex;flex-wrap:wrap;gap:1rem}.flex.row{flex-direction:row}.flex.row.rev{flex-direction:row-reverse}.flex.col{flex-direction:column}.flex.col.rev{flex-direction:column-reverse}.flex.no-wrap,.flex.nowrap{flex-wrap:nowrap}.flex.wrap{flex-wrap:wrap}.flex.start{justify-content:flex-start}.flex.end{justify-content:flex-end}.flex.center{justify-content:center}.flex.spaceBetween{justify-content:space-between}.flex.alignStart{align-content:flex-start;align-items:flex-start}.flex.alignEnd{align-content:flex-end;align-items:flex-end}.flex.alignCenter,.flex.center-v{align-content:center;align-items:center}.flex.center-h{justify-content:center;justify-items:center}.flex.stretch{align-content:stretch;align-items:stretch}.flex.alignSpaceBetween{align-content:space-between;align-items:space-between}.flex.alignSpaceAround{align-content:space-around;align-items:space-around}.justifyselfstretch{justify-self:stretch}.justifyselfcenter{justify-self:center}.justifyselfstart{justify-self:start}.justifyselfend{justify-self:end}.grid{display:grid}.grid.split{gap:0;grid-template-areas:"left right";grid-template-columns:4fr 4fr;grid-template-rows:1fr}.grid.split>.left{grid-area:left;justify-self:right;padding-right:2rem}.grid.split>.right{border-left:.2rem solid #e1e2e6;grid-area:right;justify-self:left;padding-left:2rem}.grid.split.noBorder>.left,.grid.split.noBorder>.right{border:none}@media only screen and (max-width:800px){.grid.split{grid-template-areas:"left" "right";grid-template-columns:1fr;grid-template-rows:auto auto;padding:0 2rem}.grid.split>.left,.grid.split>.right{border:none;justify-self:left;padding-left:0;padding-right:0}}.grid.list{gap:1rem;grid-template-columns:1fr 1fr 1fr;margin-bottom:2rem}.grid.split .grid.list{grid-template-columns:1fr}@media only screen and (max-width:800px){.grid.list{grid-template-columns:1fr}}.grid.hero{grid-template-areas:"content . logo";grid-template-columns:6fr 2fr 6fr;grid-template-rows:1fr}.grid.hero>.content{align-self:center;grid-area:content;justify-self:end;text-align:center}.grid.hero>.logo{align-self:center;grid-area:logo;justify-self:start}@media only screen and (max-width:800px){.grid.hero{grid-template-areas:"logo" "content";grid-template-columns:1fr;grid-template-rows:1fr 1fr}.grid.hero>.content,.grid.hero>.logo{justify-self:center}}.grid.intro{border-bottom:.2rem solid #e1e2e6;gap:4rem;grid-template-areas:"logotype actions" "content content";grid-template-columns:1fr 1fr;grid-template-rows:auto auto;margin:0 1rem 4rem;padding:1rem 2rem 4rem}.grid.intro>.logotype{align-items:center;display:flex;gap:1rem;grid-area:logotype;justify-content:start;justify-items:start}.grid.intro>.logotype p{margin-bottom:0}.grid.intro>.logotype>.logo{height:4rem;width:4rem}.grid.intro>.content{grid-area:content;text-align:center}@media only screen and (max-width:800px){.grid.intro{padding-left:1rem;padding-right:1rem}}.grid.page{grid-template-areas:". content .";grid-template-columns:2fr 10fr 2fr;grid-template-rows:1fr}.grid.page>.content{align-self:start;grid-area:content;justify-self:stretch}@media only screen and (max-width:800px){.grid.page{grid-template-columns:1fr 12fr 1fr}}.grid.screen{height:100%;margin:0 1rem}.grid.screen>.content{align-self:center;justify-self:center;margin-top:0}html.screen{height:100%}html.screen body{display:grid;grid-template-rows:auto 1fr;height:100%}header{display:grid;gap:1rem;grid-template-areas:"menu";grid-template-columns:1fr}header>.menu{grid-area:menu;justify-self:left;text-align:left}header>.options{grid-area:options;justify-self:right;padding:1rem;text-align:right}.nav>div{align-items:center;display:flex;height:100%}*+*,*+h1,*+h2,*+h3,*+h4,*+h5,*+h6,*+p{margin-top:1rem}.caption>*,.caption>div>*,.checkbox>*,.flex>*,.grid>*,.logotype>*,.nav>div,.radio>*,header>*{margin-top:0}.grid.paragraph{gap:1rem;grid-template-areas:"content image";grid-template-columns:1fr 1fr}.grid.paragraph.alt{grid-template-areas:"image content"}.grid.paragraph>.content{grid-area:content}.grid.paragraph>.image{align-items:center;display:flex;grid-area:image;justify-items:center}@media only screen and (max-width:1000px){.grid.paragraph,.grid.paragraph.alt{gap:1rem;grid-template-areas:"content" "image";grid-template-columns:1fr;grid-template-rows:1fr auto}}a.mark{color:#7c49f2}a.mark:focus-visible,a.mark:hover{color:#6639bf}.mark.ohno,.text.ohno,b.ohno,code.ohno,i.ohno,mark.ohno,p.ohno,span.ohno,u.ohno{color:#e64545}.mark.yay,.text.yay,b.yay,code.yay,i.yay,mark.yay,p.yay,span.yay,u.yay{color:#00b377}.mark.bg1,.text.bg1,b.bg1,code.bg1,i.bg1,mark.bg1,p.bg1,span.bg1,u.bg1{color:#fbfcfc}.mark.fg1,.mark.fg2,.text.fg1,.text.fg2,b.fg1,b.fg2,code.fg1,code.fg2,i.fg1,i.fg2,mark.fg1,mark.fg2,p.fg1,p.fg2,span.fg1,span.fg2,u.fg1,u.fg2{color:#343a40}.mark.fg0,.text.fg0,b.fg0,code.fg0,i.fg0,mark.fg0,p.fg0,span.fg0,u.fg0{color:#868e96}.mark.main,.text.main,b.main,code.main,i.main,mark.main,p.main,span.main,u.main{color:#7c49f2}.mark.extra,.text.extra,b.extra,code.extra,i.extra,mark.extra,p.extra,span.extra,u.extra{color:#00b377}.mark.markOhno,mark.markOhno{background-color:#e64545}.mark.markYay,mark.markYay{background-color:#00b377}.mark.markBg4,mark.markBg4{background-color:#e1e2e6}.mark.markBg2,mark.markBg2{background-color:#f0f2f5}.mark.markFg1,.mark.markFg2,mark.markFg1,mark.markFg2{background-color:#343a40}.mark.markFg0,mark.markFg0{background-color:#868e96}.mark.markMain,mark.markMain{background-color:#7c49f2}.mark.markExtra,mark.markExtra{background-color:#00b377}.box.ohno{border-color:#e64545;color:#e64545}.box.yay{border-color:#00b377;color:#00b377}.pre,pre{white-space:pre}.button.ohno,button.ohno{background-color:#e64545;border-color:#e64545}.button.extra,.button.yay,button.extra,button.yay{background-color:#00b377;border-color:#00b377}.button.extra,button.extra{color:#f0f2f5}.button.alt.ohno,button.alt.ohno{background-color:#ebedf0;border-color:#ebedf0;color:#e64545}.button.alt.extra,.button.alt.yay,button.alt.extra,button.alt.yay{background-color:#ebedf0;border-color:#ebedf0;color:#00b377}.button:focus-visible.ohno,.button:hover.ohno,button:focus-visible.ohno,button:hover.ohno{background-color:#b33636;color:#fbfcfc}.button:focus-visible.yay,.button:hover.yay,button:focus-visible.yay,button:hover.yay{background-color:#008055;color:#fbfcfc}.button:focus-visible.extra,.button:hover.extra,button:focus-visible.extra,button:hover.extra{background-color:#008055;color:#f0f2f5}.button:focus-visible.ohno,button:focus-visible.ohno{outline-color:#e64545}.button:focus-visible.yay,button:focus-visible.yay{outline-color:#00b377}.button:focus-visible.extra,button:focus-visible.extra{outline-color:#00b377}input[type=password].ohno:hover,input[type=text].ohno:hover,textarea.ohno:hover{border-color:#b33636}input[type=password].extra:hover,input[type=password].yay:hover,input[type=text].extra:hover,input[type=text].yay:hover,textarea.extra:hover,textarea.yay:hover{border-color:#008055}input[type=password].ohno:focus,input[type=password].ohno:focus-visible,input[type=text].ohno:focus,input[type=text].ohno:focus-visible,textarea.ohno:focus,textarea.ohno:focus-visible{border-color:#e64545}input[type=password].yay:focus,input[type=password].yay:focus-visible,input[type=text].yay:focus,input[type=text].yay:focus-visible,textarea.yay:focus,textarea.yay:focus-visible{border-color:#00b377}input[type=password].extra:focus,input[type=password].extra:focus-visible,input[type=text].extra:focus,input[type=text].extra:focus-visible,textarea.extra:focus,textarea.extra:focus-visible{border-color:#00b377}textarea.vertical{resize:vertical;white-space:pre}textarea.horizontal{resize:horizontal;white-space:pre}.hide{display:none}.fullscreen{align-items:center;background:#fbfcfc;display:flex;height:100vh;justify-content:center;left:0;margin:0;position:fixed;top:0;width:100vw;z-index:200}.exitFullscreen{display:none;left:1rem;margin:0;position:fixed;top:1rem}.fullscreen>.button.exitFullscreen,.fullscreen>button.exitFullscreen{display:inline-block}.invisible{height:1px;margin:0;opacity:0;overflow:hidden;position:absolute;width:1px}.hero>.logo:before{background-color:#7c49f2;border-radius:50%;content:"";filter:blur(1rem);height:200px;opacity:.2;position:absolute;width:200px;z-index:-100}html.min .hero>.logo:before{display:none}.hero>.logo>svg{margin-top:0}.fullWidth{width:100%}.grid.page.extra{background-color:#f0f2f5;margin-bottom:0;margin-top:0;padding-bottom:1rem}.button.large,button.large{font-size:1.2rem;line-height:1.6rem;padding:.6rem 1.2rem}.fill-ohno{fill:#e64545}.fill-ohno-alt{fill:#b33636}.fill-yay{fill:#00b377}.fill-yay-alt{fill:#008055}.fill-main{fill:#7c49f2}.fill-main-alt{fill:#6639bf}.fill-extra{fill:#00b377}.fill-extra-alt{fill:#008055}.fill-extra-bg{fill:#f0f2f5}.fill-fg1,.fill-fg2{fill:#343a40}.fill-fg0{fill:#868e96}.fill-bg4{fill:#e1e2e6}.fill-bg3{fill:#ebedf0}.fill-bg2{fill:#f0f2f5}.fill-bg1{fill:#fbfcfc}.fill-bg0{fill:#f0f2f5}.background-bg2,.background-extra-bg{background-color:#f0f2f5}.background-bg1{background-color:#fbfcfc}.background-bg0{background-color:#f0f2f5}.dropdown .content .button.ohno,.dropdown .content button.ohno{background-color:#f0f2f5;border-color:#f0f2f5;color:#e64545}.dropdown .content .button.yay,.dropdown .content button.yay{background-color:#f0f2f5;border-color:#f0f2f5;color:#00b377}.dropdown .content .button.ohno:focus-visible,.dropdown .content .button.ohno:hover,.dropdown .content button.ohno:focus-visible,.dropdown .content button.ohno:hover{background-color:#ebedf0;border-color:#ebedf0;color:#b33636}.dropdown .content .button.yay:focus-visible,.dropdown .content .button.yay:hover,.dropdown .content button.yay:focus-visible,.dropdown .content button.yay:hover{background-color:#ebedf0;border-color:#ebedf0;color:#008055}@media (prefers-reduced-motion){html{scroll-behavior:auto}.a,.button,a,button,input[type=checkbox],input[type=password],input[type=radio],input[type=text],textarea{transition-duration:0s}.card,.card.double{perspective:none}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:flat;transition-duration:0s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:visible;-webkit-backface-visibility:visible;-moz-backface-visibility:visible;background-color:#f0f2f5;border-radius:.8rem;height:100%;justify-content:center;position:absolute;text-align:center;transform:none;width:100%}.card.double>.content>.back{display:none;transform:none}.card.double>.content>.front{display:flex}.card.double.flip>.content{transform:none}.card.double.flip>.content>.back{display:flex}.card.double.flip>.content>.front{display:none}} \ No newline at end of file +*/:root{color-scheme:light}html{font-size:18px;height:auto;scroll-behavior:smooth}@media only screen and (max-width:800px){html{font-size:16px}}body{background-color:#fbfcfc;color:#343a40;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;height:auto;line-height:1.4;margin:0}::selection{background-color:#c499ff;color:#343a40}.h1,h1{font-size:3.4rem}.h1,.h2,h1,h2{font-weight:700;margin-bottom:1rem;margin-top:0}.h2,h2{font-size:2.8rem}.h3,h3{font-size:2.2rem}.h3,.h4,h3,h4{font-weight:700;margin-bottom:1rem;margin-top:0}.h4,h4{font-size:1.6rem}.h1,.h2,.h3,.h4,h1,h2,h3,h4{line-height:1.2}.h5,h5,p{font-size:1rem;font-weight:400;margin-bottom:1rem;margin-top:0}p{margin-block-end:0}.h6,h6,small{font-size:.8rem;font-weight:400;margin-bottom:1rem}.h5,.h6,h5,h6,p,small{line-height:1.4}.b,b{font-weight:700}.i,i{font-style:italic}i.nf{font-style:normal}.s,s{text-decoration:line-through}.mark,mark{background-color:#343a40;color:#fbfcfc}.code,.mark,code,mark{border-radius:.4rem;font-size:1rem;line-height:1.4;padding:.2rem .4rem}.code,code{font-family:monospace}.box,.code,code{background-color:#f0f2f5}.box{border:.2rem solid #f0f2f5;border-radius:.8rem;color:#343a40;padding:1rem}.hero{border-bottom:.2rem solid #e1e2e6;margin:4rem 1rem;padding:1rem 1rem 4rem;text-align:center}.topmost{margin:1rem}.header,header{background-color:#fbfcfc;border-bottom:.2rem solid #e1e2e6;height:4rem;margin:0 0 1rem;padding:0;position:static}.header.sticky,header.sticky{margin:0;position:sticky;top:0;z-index:100}header>.nav{align-items:center;display:flex;gap:1rem;margin:0 1rem}.nav>div{border-bottom:.2rem solid #fbfcfc}.nav>div.current{border-bottom:.2rem solid #6639bf}.nav>div.current>a{color:#6639bf}.footer,footer{border-top:.2rem solid #e1e2e6;margin:4rem 1rem;padding:4rem 1rem 1rem;text-align:center}table{border:.2rem solid #e1e2e6;border-collapse:separate;border-radius:.8rem;border-spacing:0}td{font-weight:400}td,th{padding:1rem;text-align:left}th{font-weight:700}table.outer tbody,table.outer td,table.outer tfoot,table.outer th,table.outer thead{border:none}table.inner td:not(:last-child),table.inner th:not(:last-child){border-right:.2rem solid #e1e2e6}table.inner>tbody:not(:last-child),table.inner>tbody>tr:not(:last-child)>td,table.inner>tbody>tr:not(:last-child)>th,table.inner>thead:not(:last-child),table.inner>thead>tr>td,table.inner>thead>tr>th,table.inner>tr:not(:last-child)>td,table.inner>tr:not(:last-child)>th{border-bottom:.2rem solid #e1e2e6}.a,a{border-radius:.4rem;color:#7c49f2;cursor:pointer;font-size:1rem;line-height:1.4;text-decoration:none;transition-duration:.4s}.a:focus-visible,.a:hover,a:focus-visible,a:hover{color:#6639bf}.a:focus-visible,a:focus-visible{outline:.2rem solid #7c49f2;outline-offset:.4rem;transition-duration:.1s}.button,button{align-items:flex-start;appearance:none;background-color:#7c49f2;border:.2rem solid #7c49f2;border-radius:2rem;box-sizing:border-box;color:#fbfcfc;cursor:pointer;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;font-weight:600;line-height:1.4;padding:.4rem .8rem;text-align:center;text-decoration:none;transition-duration:.4s}.button.alt,button.alt{background-color:#ebedf0;border-color:#ebedf0;color:#7c49f2}.button:focus-visible,.button:hover,button:focus-visible,button:hover{background-color:#6639bf;color:#fbfcfc}.button:focus-visible,button:focus-visible{outline:.2rem solid #7c49f2;outline-offset:.2rem;transition-duration:.1s}::placeholder{color:#868e96;font-family:nunito,sans-serif;font-size:1rem;font-weight:400;opacity:1}input[type=password],input[type=text],textarea{align-items:flex-start;appearance:none;background-color:#fbfcfc;border:.2rem solid #e1e2e6;border-radius:.8rem;box-sizing:border-box;color:#343a40;cursor:text;display:inline-block;font-family:nunito,sans-serif;font-size:1rem;line-height:1.4;outline:none;padding:.4rem .8rem;text-align:left;text-decoration:none;transition-duration:.4s}input[type=password]:hover,input[type=text]:hover,textarea:hover{border-color:#6639bf}input[type=password]:focus,input[type=password]:focus-visible,input[type=text]:focus,input[type=text]:focus-visible,textarea:focus,textarea:focus-visible{border-color:#7c49f2}.checkbox,.radio{display:grid;gap:1em;grid-template-areas:"input label .";grid-template-columns:1.8rem auto 1fr}.checkbox input,.radio input{grid-area:input}.checkbox label,.radio label{grid-area:label}input[type=checkbox],input[type=radio]{appearance:none;background-color:#fbfcfc;border:.2rem solid #7c49f2;height:1.8rem;margin:0;transition-duration:.4s;width:1.8rem}input[type=radio]{border-radius:50%}input[type=checkbox]{border-radius:.6rem}input[type=checkbox]:focus-visible,input[type=checkbox]:hover,input[type=radio]:focus-visible,input[type=radio]:hover{border-color:#6639bf}input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline:.2rem solid #7c49f2;outline-offset:.2rem;transition-duration:.1s}input[type=checkbox]:checked,input[type=radio]:checked{background-color:#7c49f2;transition-duration:.1s}.card{height:20rem;width:40rem}.caption{display:grid;gap:1rem;grid-template-rows:1fr;width:40rem}.caption.centerThree{grid-template-columns:1fr 4fr 1fr}.caption.evenTwo{grid-template-columns:1fr 1fr}.caption.evenThree{grid-template-columns:1fr 1fr 1fr}@media only screen and (max-width:800px){.caption,.card{width:100%}}.card>.content{align-items:center;background-color:#f0f2f5;border-radius:.8rem;display:flex;height:100%;justify-content:center;position:relative;text-align:center;width:100%}.card.double{perspective:1000px}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:preserve-3d;transition:transform .4s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;background-color:#f0f2f5;border-radius:.8rem;box-shadow:0 4px 10px 2px rgba(0,0,0,.1);display:flex;height:100%;justify-content:center;margin-top:0;position:absolute;text-align:center;transform:rotateX(0deg);width:100%}.card.double.flip>.content,.card.double>.content>.back{transform:rotateY(180deg)}.separator{align-items:center;color:#868e96;display:flex;justify-content:center}.separator:after,.separator:before{background:#e1e2e6;content:"";display:block;height:.2rem;margin:0 1rem;width:100%}.modal{align-items:center;display:flex;justify-content:center;z-index:200}.modal,.modal:before{height:100vh;left:0;position:fixed;top:0;width:100vw}.modal:before{background-color:#f0f2f5;content:"";opacity:.6;z-index:180}.modal>.content{background-color:#fbfcfc;border:.2rem solid #e1e2e6;border-radius:.8rem;padding:1rem;width:60vw;z-index:200}@media only screen and (max-width:800px){.modal{align-items:flex-end}.modal>.content{border:none;border-radius:0;border-top:.2rem solid #e1e2e6;padding-bottom:8rem;width:100vw}}.flex.pop{padding:0 1rem}.dropdown{display:inline-block;position:relative}.dropdown .content{align-items:stretch;background:#f0f2f5;border:.2rem solid #e1e2e6;border-radius:.8rem;display:none;flex-direction:column;gap:.4rem;margin-top:.4rem;padding:.4rem;position:absolute;z-index:1}.dropdown:focus-within .content{display:flex}.dropdown .content .button,.dropdown .content button{background-color:#f0f2f5;border-color:#f0f2f5;color:#7c49f2;margin-top:0;text-wrap:nowrap}.dropdown .content .button:focus-visible,.dropdown .content .button:hover,.dropdown .content button:focus-visible,.dropdown .content button:hover{background-color:#ebedf0;border-color:#ebedf0;color:#6639bf}.button.dropdown-toggle,.button.icon-only-button,button.dropdown-toggle,button.icon-only-button{background-color:transparent;border:none;color:#343a40}.button.dropdown-toggle:focus-visible,.button.dropdown-toggle:hover,.button.icon-only-button:focus-visible,.button.icon-only-button:hover,button.dropdown-toggle:focus-visible,button.dropdown-toggle:hover,button.icon-only-button:focus-visible,button.icon-only-button:hover{background-color:#ebedf0;border:none;color:#6639bf}*,:after,:before{box-sizing:border-box}.center{text-align:center}.flex{display:flex;flex-wrap:wrap;gap:1rem}.flex.row{flex-direction:row}.flex.row.rev{flex-direction:row-reverse}.flex.col{flex-direction:column}.flex.col.rev{flex-direction:column-reverse}.flex.no-wrap,.flex.nowrap{flex-wrap:nowrap}.flex.wrap{flex-wrap:wrap}.flex.start{justify-content:flex-start}.flex.end{justify-content:flex-end}.flex.center{justify-content:center}.flex.spaceBetween{justify-content:space-between}.flex.alignStart{align-content:flex-start;align-items:flex-start}.flex.alignEnd{align-content:flex-end;align-items:flex-end}.flex.alignCenter,.flex.center-v{align-content:center;align-items:center}.flex.center-h{justify-content:center;justify-items:center}.flex.stretch{align-content:stretch;align-items:stretch}.flex.alignSpaceBetween{align-content:space-between;align-items:space-between}.flex.alignSpaceAround{align-content:space-around;align-items:space-around}.justifyselfstretch{justify-self:stretch}.justifyselfcenter{justify-self:center}.justifyselfstart{justify-self:start}.justifyselfend{justify-self:end}.flex.compact-gap{gap:.2rem}.grid{display:grid}.grid.split{gap:0;grid-template-areas:"left right";grid-template-columns:4fr 4fr;grid-template-rows:1fr}.grid.split>.left{grid-area:left;justify-self:right;padding-right:2rem}.grid.split>.right{border-left:.2rem solid #e1e2e6;grid-area:right;justify-self:left;padding-left:2rem}.grid.split.noBorder>.left,.grid.split.noBorder>.right{border:none}@media only screen and (max-width:800px){.grid.split{grid-template-areas:"left" "right";grid-template-columns:1fr;grid-template-rows:auto auto;padding:0 2rem}.grid.split>.left,.grid.split>.right{border:none;justify-self:left;padding-left:0;padding-right:0}}.grid.list{gap:1rem;grid-template-columns:1fr 1fr 1fr;margin-bottom:2rem}.grid.split .grid.list{grid-template-columns:1fr}@media only screen and (max-width:800px){.grid.list{grid-template-columns:1fr}}.grid.hero{grid-template-areas:"content . logo";grid-template-columns:6fr 2fr 6fr;grid-template-rows:1fr}.grid.hero>.content{align-self:center;grid-area:content;justify-self:end;text-align:center}.grid.hero>.logo{align-self:center;grid-area:logo;justify-self:start}@media only screen and (max-width:800px){.grid.hero{grid-template-areas:"logo" "content";grid-template-columns:1fr;grid-template-rows:1fr 1fr}.grid.hero>.content,.grid.hero>.logo{justify-self:center}}.grid.intro{border-bottom:.2rem solid #e1e2e6;gap:4rem;grid-template-areas:"logotype actions" "content content";grid-template-columns:1fr 1fr;grid-template-rows:auto auto;margin:0 1rem 4rem;padding:1rem 2rem 4rem}.grid.intro>.logotype{align-items:center;display:flex;gap:1rem;grid-area:logotype;justify-content:start;justify-items:start}.grid.intro>.logotype p{margin-bottom:0}.grid.intro>.logotype>.logo{height:4rem;width:4rem}.grid.intro>.content{grid-area:content;text-align:center}@media only screen and (max-width:800px){.grid.intro{padding-left:1rem;padding-right:1rem}}.grid.page{grid-template-areas:". content .";grid-template-columns:2fr 10fr 2fr;grid-template-rows:1fr}.grid.page>.content{align-self:start;grid-area:content;justify-self:stretch}@media only screen and (max-width:800px){.grid.page{grid-template-columns:1fr 12fr 1fr}}.grid.screen{height:100%;margin:0 1rem}.grid.screen>.content{align-self:center;justify-self:center;margin-top:0}html.screen{height:100%}html.screen body{display:grid;grid-template-rows:auto 1fr;height:100%}header{display:grid;gap:1rem;grid-template-areas:"menu";grid-template-columns:1fr}header>.menu{grid-area:menu;justify-self:left;text-align:left}header>.options{grid-area:options;justify-self:right;padding:1rem;text-align:right}.nav>div{align-items:center;display:flex;height:100%}*+*,*+h1,*+h2,*+h3,*+h4,*+h5,*+h6,*+p{margin-top:1rem}.caption>*,.caption>div>*,.checkbox>*,.flex>*,.grid>*,.logotype>*,.nav>div,.radio>*,header>*{margin-top:0}.grid.paragraph{gap:1rem;grid-template-areas:"content image";grid-template-columns:1fr 1fr}.grid.paragraph.alt{grid-template-areas:"image content"}.grid.paragraph>.content{grid-area:content}.grid.paragraph>.image{align-items:center;display:flex;grid-area:image;justify-items:center}@media only screen and (max-width:1000px){.grid.paragraph,.grid.paragraph.alt{gap:1rem;grid-template-areas:"content" "image";grid-template-columns:1fr;grid-template-rows:1fr auto}}a.mark{color:#7c49f2}a.mark:focus-visible,a.mark:hover{color:#6639bf}.mark.ohno,.text.ohno,b.ohno,code.ohno,i.ohno,mark.ohno,p.ohno,span.ohno,u.ohno{color:#e64545}.mark.yay,.text.yay,b.yay,code.yay,i.yay,mark.yay,p.yay,span.yay,u.yay{color:#00b377}.mark.bg1,.text.bg1,b.bg1,code.bg1,i.bg1,mark.bg1,p.bg1,span.bg1,u.bg1{color:#fbfcfc}.mark.fg1,.mark.fg2,.text.fg1,.text.fg2,b.fg1,b.fg2,code.fg1,code.fg2,i.fg1,i.fg2,mark.fg1,mark.fg2,p.fg1,p.fg2,span.fg1,span.fg2,u.fg1,u.fg2{color:#343a40}.mark.fg0,.text.fg0,b.fg0,code.fg0,i.fg0,mark.fg0,p.fg0,span.fg0,u.fg0{color:#868e96}.mark.main,.text.main,b.main,code.main,i.main,mark.main,p.main,span.main,u.main{color:#7c49f2}.mark.extra,.text.extra,b.extra,code.extra,i.extra,mark.extra,p.extra,span.extra,u.extra{color:#00b377}.mark.markOhno,mark.markOhno{background-color:#e64545}.mark.markYay,mark.markYay{background-color:#00b377}.mark.markBg4,mark.markBg4{background-color:#e1e2e6}.mark.markBg2,mark.markBg2{background-color:#f0f2f5}.mark.markFg1,.mark.markFg2,mark.markFg1,mark.markFg2{background-color:#343a40}.mark.markFg0,mark.markFg0{background-color:#868e96}.mark.markMain,mark.markMain{background-color:#7c49f2}.mark.markExtra,mark.markExtra{background-color:#00b377}.box.ohno{border-color:#e64545;color:#e64545}.box.yay{border-color:#00b377;color:#00b377}.pre,pre{white-space:pre}.button.ohno,button.ohno{background-color:#e64545;border-color:#e64545}.button.extra,.button.yay,button.extra,button.yay{background-color:#00b377;border-color:#00b377}.button.extra,button.extra{color:#f0f2f5}.button.alt.ohno,button.alt.ohno{background-color:#ebedf0;border-color:#ebedf0;color:#e64545}.button.alt.extra,.button.alt.yay,button.alt.extra,button.alt.yay{background-color:#ebedf0;border-color:#ebedf0;color:#00b377}.button:focus-visible.ohno,.button:hover.ohno,button:focus-visible.ohno,button:hover.ohno{background-color:#b33636;color:#fbfcfc}.button:focus-visible.yay,.button:hover.yay,button:focus-visible.yay,button:hover.yay{background-color:#008055;color:#fbfcfc}.button:focus-visible.extra,.button:hover.extra,button:focus-visible.extra,button:hover.extra{background-color:#008055;color:#f0f2f5}.button:focus-visible.ohno,button:focus-visible.ohno{outline-color:#e64545}.button:focus-visible.yay,button:focus-visible.yay{outline-color:#00b377}.button:focus-visible.extra,button:focus-visible.extra{outline-color:#00b377}input[type=password].ohno:hover,input[type=text].ohno:hover,textarea.ohno:hover{border-color:#b33636}input[type=password].extra:hover,input[type=password].yay:hover,input[type=text].extra:hover,input[type=text].yay:hover,textarea.extra:hover,textarea.yay:hover{border-color:#008055}input[type=password].ohno:focus,input[type=password].ohno:focus-visible,input[type=text].ohno:focus,input[type=text].ohno:focus-visible,textarea.ohno:focus,textarea.ohno:focus-visible{border-color:#e64545}input[type=password].yay:focus,input[type=password].yay:focus-visible,input[type=text].yay:focus,input[type=text].yay:focus-visible,textarea.yay:focus,textarea.yay:focus-visible{border-color:#00b377}input[type=password].extra:focus,input[type=password].extra:focus-visible,input[type=text].extra:focus,input[type=text].extra:focus-visible,textarea.extra:focus,textarea.extra:focus-visible{border-color:#00b377}textarea.vertical{resize:vertical;white-space:pre}textarea.horizontal{resize:horizontal;white-space:pre}.hide{display:none}.fullscreen{align-items:center;background:#fbfcfc;display:flex;height:100vh;justify-content:center;left:0;margin:0;position:fixed;top:0;width:100vw;z-index:200}.exitFullscreen{display:none;left:1rem;margin:0;position:fixed;top:1rem}.fullscreen>.button.exitFullscreen,.fullscreen>button.exitFullscreen{display:inline-block}.invisible{height:1px;margin:0;opacity:0;overflow:hidden;position:absolute;width:1px}.hero>.logo:before{background-color:#7c49f2;border-radius:50%;content:"";filter:blur(1rem);height:200px;opacity:.2;position:absolute;width:200px;z-index:-100}html.min .hero>.logo:before{display:none}.hero>.logo>svg{margin-top:0}.fullWidth{width:100%}.grid.page.extra{background-color:#f0f2f5;margin-bottom:0;margin-top:0;padding-bottom:1rem}.button.large,button.large{font-size:1.2rem;line-height:1.6rem;padding:.6rem 1.2rem}.fill-ohno{fill:#e64545}.fill-ohno-alt{fill:#b33636}.fill-yay{fill:#00b377}.fill-yay-alt{fill:#008055}.fill-main{fill:#7c49f2}.fill-main-alt{fill:#6639bf}.fill-extra{fill:#00b377}.fill-extra-alt{fill:#008055}.fill-extra-bg{fill:#f0f2f5}.fill-fg1,.fill-fg2{fill:#343a40}.fill-fg0{fill:#868e96}.fill-bg4{fill:#e1e2e6}.fill-bg3{fill:#ebedf0}.fill-bg2{fill:#f0f2f5}.fill-bg1{fill:#fbfcfc}.fill-bg0{fill:#f0f2f5}.background-bg2,.background-extra-bg{background-color:#f0f2f5}.background-bg1{background-color:#fbfcfc}.background-bg0{background-color:#f0f2f5}.dropdown .content .button.ohno,.dropdown .content button.ohno{background-color:#f0f2f5;border-color:#f0f2f5;color:#e64545}.dropdown .content .button.yay,.dropdown .content button.yay{background-color:#f0f2f5;border-color:#f0f2f5;color:#00b377}.dropdown .content .button.ohno:focus-visible,.dropdown .content .button.ohno:hover,.dropdown .content button.ohno:focus-visible,.dropdown .content button.ohno:hover{background-color:#ebedf0;border-color:#ebedf0;color:#b33636}.dropdown .content .button.yay:focus-visible,.dropdown .content .button.yay:hover,.dropdown .content button.yay:focus-visible,.dropdown .content button.yay:hover{background-color:#ebedf0;border-color:#ebedf0;color:#008055}.button.dropdown-toggle.ohno,.button.icon-only-button.ohno,button.dropdown-toggle.ohno,button.icon-only-button.ohno{background-color:transparent;border:none;color:#e64545}.button.dropdown-toggle.ohno:focus-visible,.button.dropdown-toggle.ohno:hover,.button.icon-only-button.ohno:focus-visible,.button.icon-only-button.ohno:hover,button.dropdown-toggle.ohno:focus-visible,button.dropdown-toggle.ohno:hover,button.icon-only-button.ohno:focus-visible,button.icon-only-button.ohno:hover{background-color:#ebedf0;border:none;color:#b33636}.button.dropdown-toggle.yay,.button.icon-only-button.yay,button.dropdown-toggle.yay,button.icon-only-button.yay{background-color:transparent;border:none;color:#00b377}.button.dropdown-toggle.yay:focus-visible,.button.dropdown-toggle.yay:hover,.button.icon-only-button.yay:focus-visible,.button.icon-only-button.yay:hover,button.dropdown-toggle.yay:focus-visible,button.dropdown-toggle.yay:hover,button.icon-only-button.yay:focus-visible,button.icon-only-button.yay:hover{background-color:#ebedf0;border:none;color:#008055}@media (prefers-reduced-motion){html{scroll-behavior:auto}.a,.button,a,button,input[type=checkbox],input[type=password],input[type=radio],input[type=text],textarea{transition-duration:0s}.card,.card.double{perspective:none}.card.double>.content{align-items:normal;background-color:inherit;border-radius:0;display:block;justify-content:normal;text-align:center;transform-style:flat;transition-duration:0s}.card.double>.content>.back,.card.double>.content>.front{align-items:center;backface-visibility:visible;-webkit-backface-visibility:visible;-moz-backface-visibility:visible;background-color:#f0f2f5;border-radius:.8rem;height:100%;justify-content:center;position:absolute;text-align:center;transform:none;width:100%}.card.double>.content>.back{display:none;transform:none}.card.double>.content>.front{display:flex}.card.double.flip>.content{transform:none}.card.double.flip>.content>.back{display:flex}.card.double.flip>.content>.front{display:none}} \ No newline at end of file