:root{--border-radius: 10px;--column-gap: 40px;--main-page-code-padding: 28px;--hero-major-margin: 40px;--feature-margin: 40px;--single-column-threshold: 1000px;--button-color: rgb(49, 46, 129);--button-content-color: white;--fg-color: black;--bg-color: #fffafa;--code-bg-color: white;--link-color: #0037b9}@media (prefers-color-scheme: dark){:root{--button-color: rgb(49, 46, 129);--button-content-color: white;--fg-color: white;--bg-color: black;--code-bg-color: #0b151d;--link-color: rgb(122, 162, 255);--bold-color: #bb6aff }}main{margin:2em;font-size:17px;line-height:1.6}a{text-decoration:None;color:var(--link-color)}pre{font-weight:500;font-size:.7em;padding:0;margin:0;overflow:scroll auto}img{max-width:100%}.code-container{position:relative;margin:5px;border-radius:var(--border-radius);background-color:var(--code-bg-color);position:relative;display:inline-block}.code-container::before{content:"";position:absolute;inset:0;border-radius:var(--border-radius);padding:2px;background:var(--outline-gradient);mask:conic-gradient(#000 0 0) content-box,conic-gradient(#000 0 0);mask-composite:exclude;pointer-events:none}@media (max-width: 1000px){.code-container{width:100%;box-sizing:border-box}.code-container:has(img){width:fit-content;margin-left:auto;margin-right:auto}}@media (prefers-color-scheme: light){.code-container{box-shadow:8px 8px 4px #ccc}}:root{--gradient-start: rgba(131, 58, 180, 1);--gradient-end: rgba(253, 29, 70, 1);--outline-gradient: linear-gradient(122deg, var(--gradient-start) 0%, rgba(82, 138, 190, 1) 49%, var(--gradient-end) 100%) border-box }@media (prefers-color-scheme: dark){:root{--gradient-start: rgba(131, 58, 180, 1);--gradient-end: rgba(66, 253, 29, 1);--outline-gradient: linear-gradient(122deg,var(--gradient-start) 0%, rgba(81, 194, 168, 1) 50%, var(--gradient-end) 100%) border-box }}html{tab-size:4;font-family:"Fira Sans",sans-serif;font-feature-settings:normal;font-variation-settings:normal}body{color:var(--fg-color);background-color:var(--bg-color)}main,header,footer{max-width:1000px;margin:0px auto}footer{border-top:1px #ccc solid}header{--padding: 0.7em;padding:var(--padding);display:flex;flex-wrap:wrap;width:calc(100% - var(--padding)*2);font-size:1.3rem;border-bottom:1px #ccc solid}header .hidden{display:none}header .header-logo{flex-grow:1}header .header-logo img{padding:.2em;margin-bottom:-.3em;border-radius:.3em;background:linear-gradient(180deg, red 16.66%, orange 0 33.33%, #ffff1a 0 50%, #00bd00 0 66.66%, #3d3dff 0 83.33%, #6e00bf 0)}header a{text-decoration:none;color:var(--fg-color)}header .menu-button:hover{color:var(--link-color)}header .header-logo{font-weight:700;font-size:2.25rem}header .inline-icon{height:1em;display:inline}header #nav-menu-toggle-icon{font-family:Material Symbols Outlined;margin:auto 0px;font-size:2.25rem}header #nav-menu{margin-left:auto;margin-right:auto;display:flex;gap:1.3em}header #nav-menu a{margin:auto 0px}header #nav-menu a img{background-color:#000;margin-bottom:-.4em;padding:.4em;border-radius:.6em}@media (max-width: 860px){header #nav-menu{flex-direction:column;width:100%;border-top:1px gray solid;padding-top:.5em;margin-top:1em}header #nav-menu{display:none}header #nav-menu-toggle:checked~#nav-menu{display:flex}header .header-logo{font-size:1.25em}}@media (min-width: 860px){header #nav-menu-toggle-icon{display:none}}.kw-hint{font-size:.8em;text-align:center;filter:contrast(0%)}@media (max-width: 800px){ul{padding-left:.5em}}.hero{padding-top:var(--hero-major-margin);padding-bottom:var(--hero-major-margin)}.hero h1{text-align:center;margin-top:var(--hero-major-margin)}.hero .columns{display:flex;margin:var(--hero-major-margin) auto;justify-content:center;gap:var(--column-gap);flex-wrap:wrap}.hero .description{margin:auto 0px}.hero .example{max-width:100%}.hero ul li{margin-top:.5em}.hero .links{display:flex;flex-wrap:wrap;justify-content:center;width:fit-content;margin:0 auto;gap:var(--column-gap)}.hero .links a{width:fit-content;background-color:var(--button-color);color:var(--button-content-color);text-decoration:none;padding:.7em;font-size:1.3em;border-radius:var(--border-radius)}.hero .links a>p{display:inline}.hero .links a img{display:inline;height:1.1em;margin:0em;margin-bottom:-.2em;padding-bottom:0em}@media-query (prefers-color-scheme: light){.hero pre{box-shadow:4px 4px 2px #ccc}}.hero pre{padding:var(--main-page-code-padding);box-sizing:border-box}.feature{gap:var(--column-gap);margin:var(--feature-margin) 0;display:grid;gap:40px;grid-template-columns:2.2fr 3.2fr}.feature .description{flex-grow:1}.feature .description h2{margin-top:0;font-weight:400}.feature .description h2 strong{font-weight:700}.feature .surfer{width:100%;height:100%}.feature .phoebe-aquarium{display:flex;justify-content:center}.feature .phoebe-aquarium img{height:10em}.feature .image{width:100%}.feature .image pre{padding:var(--main-page-code-padding);box-sizing:border-box;overflow:scroll}.feature .surfer-screenshot{max-height:330px;max-width:100%;border-radius:var(.5em)}@media (max-width: 1000px){.feature{display:flex;flex-wrap:wrap;max-width:700px;margin-left:auto;margin-right:auto}}@media (min-width: 1000px){.feature:nth-of-type(even){grid-template-columns:3.2fr 2.2fr}.feature:nth-of-type(even) div:nth-of-type(2){order:-1}.phoebe-outer{width:80%;margin-left:auto;margin-right:auto}}.call-to-action{text-align:center;display:flex;flex-wrap:wrap;justify-content:center}.call-to-action h2{font-size:2.25em;width:100%}.call-to-action .button-container{margin-bottom:1.3em;width:100%}.call-to-action p{max-width:600px}.end-text{display:flex;flex-wrap:wrap;margin:2em auto;max-width:700px;justify-content:center}.end-text p:has(.open-source){text-align:center;font-size:1.25em;padding-bottom:1em}.end-text .affiliation{width:100%;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center}.end-text .affiliation img{height:100px;max-width:100%}@media (min-width: 400px){.end-text .affiliation img{margin-left:20px}}.end-text .affiliation .liu-logo{padding-right:22px}div.publication_links a::before,div#release-links a::before{content:"["}div.publication_links a::after,div#release-links a::after{content:"]"}.slideshow{position:relative;width:100%;display:grid}.slideshow p{margin-left:var(--feature-margin);margin-right:var(--feature-margin)}.slideshow p:has(label){margin:0px;padding:0px}.slideshow p:has(.slide-radio){display:none}.slideshow .slide-content{width:100%;grid-column-start:1;grid-row-start:1;opacity:0%;pointer-events:none;display:flex;align-items:center}.slideshow .slide-inner{flex-grow:1}.slideshow p:has(>.slide-radio:checked)+.slide-content{opacity:100%;pointer-events:all}.slideshow .slide-button{--button-size: 1.4em;position:absolute;margin:auto 0;line-height:100%;font-size:1.4em;width:var(--button-size);height:var(--button-size);display:flex;align-items:center;justify-content:center;cursor:pointer;user-select:none;border-radius:var(--border-radius);background-color:var(--code-bg-color);margin-top:calc(-1*(var(--button-size))/2)}.slideshow .slide-button span{height:0;margin-bottom:1.25em}.slideshow .slide-button.next{margin-right:-.75em;right:0;border:2px var(--gradient-end) solid}.slideshow .slide-button.prev{margin-left:-.75em;border:2px #6b5bb9 solid}@media (max-width: 1000px){.code-container:has(.slideshow){--margin: 1.0em;margin-left:var(--margin);margin-right:var(--margin);max-width:calc(100% - var(--margin)*2);overflow:revert}.code-container:has(.slideshow) .slideshow{grid-template-columns:100%}.code-container:has(.slideshow) .slideshow .slide-inner{overflow:scroll}}.z-comment{white-space:break-spaces}:root{--close-area-idx: 1;--label-idx: 2;--tooltip-idx: 3}.tooltip-wrapper{display:inline}.tooltip-wrapper>.tooltip{display:none;max-width:350px;white-space:normal}.tooltip-wrapper>p{display:inline}.tooltip{background-color:var(--code-bg-color);z-index:var(--tooltip-idx)}.tooltip p:first-of-type{margin-top:0}.tooltip p:last-of-type{margin-bottom:0}.tooltipped{position:relative;cursor:help;z-index:var(--label-idx)}.tooltip-wrapper>input{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.tooltip-wrapper input:focus~.tooltip{display:block;position:absolute;y:1.3em;border:2px gray solid;border-radius:var(--border-radius);padding:1em}.tooltip-wrapper input:focus~.close-area{position:fixed;top:0;left:0;right:0;bottom:0;opacity:0;z-index:var(--close-area-idx)}.only-dark{display:none}.invert-always{filter:invert(100%)}@media (prefers-color-scheme: light){.invert-light{filter:invert(100%)}}@media (prefers-color-scheme: dark){.only-dark{display:block}.only-light{display:none}}