*{box-sizing:border-box;margin:0;padding:0;text-decoration:none;font-family:Arial,sans-serif}p,pre,h1,h2,h3,h4,h5,h6,li,a,label{color:var(--dark-text)}html{font-size:16px;height:100vh;height:100dvh;overflow:hidden}@media only screen and (max-width: 768px){html{overflow:visible;font-size:14px}}@media screen and (-moz-device-pixel-ratio){html{overflow:hidden}}:root:has(.light-theme){--dark-background: #075985;--medium-background: #e0f2fe;--light-background: white;--medium-text: #f0f9ff;--medium-text-hover: #cbd5e1;--white-text: white;--dark-text: black;--input-accent-color: #0369a1;--button-background: #075985;--button-text: white;--button-hover: #0c4a6e;--button-disabled-background: #e2e8f0;--button-disabled-text: #94a3b8;--control-button-background: #0c4a6e;--control-button-hover: #082f49;--slider-background: #94a3b8}:root:has(.dark-theme){--dark-background: #075985;--medium-background: #353535;--light-background: #262626;--medium-text: #f0f9ff;--medium-text-hover: #cbd5e1;--white-text: white;--dark-text: white;--input-accent-color: #0369a1;--button-background: #075985;--button-text: white;--button-hover: #0c4a6e;--button-disabled-background: #737373;--button-disabled-text: #404040;--control-button-background: #075985;--control-button-hover: #0c4a6e;--slider-background: #94a3b8}:root:has(.dark-theme):has(.highcontrast-theme){--medium-background: #262626;--light-background: black;--input-accent-color: #38bdf8;--button-background: #0284c7;--button-hover: #0369a1;--button-disabled-background: #a3a3a3;--button-disabled-text: #525252;--control-button-background: #0284c7;--control-button-hover: #0369a1}@media (prefers-color-scheme: dark){body{background-color:#000;color:#fff}}button:hover{cursor:pointer}button:hover:disabled{cursor:auto}input[type=radio],input[type=checkbox],input[type=range]{accent-color:var(--input-accent-color)}[data-tooltip]:not([data-tooltip=""]){position:relative}[data-tooltip]:not([data-tooltip=""]):after{background-color:#fff;color:#000;font-size:.9rem;padding:6px 10px;height:fit-content;width:fit-content;border-radius:6px;position:absolute;text-align:center;text-wrap:nowrap;bottom:0;left:50%;content:attr(data-tooltip);transform:translate(-50%,110%) scale(0);transform-origin:top;transition:.14s;box-shadow:0 4px 14px #0003,0 0 0 1px #0000000d;z-index:9999}[data-tooltip]:not([data-tooltip=""]):hover:after{display:block;transform:translate(-50%,110%) scale(1)}@media only screen and (max-width: 768px){[data-tooltip]:not([data-tooltip=""]):after{content:normal}}#root{height:100vh;height:100dvh;display:grid;grid-template-columns:clamp(300px,20vw,450px) 1fr;grid-template-rows:auto 1fr auto;grid-template-areas:"header header" "aside main" "footer footer"}@media only screen and (max-width: 768px){#root{grid-template-columns:1fr}#root:has(.menu-closed){grid-template-areas:"header" "main" "footer"}#root:has(.menu-open){grid-template-areas:"header" "aside" "footer"}}header{grid-area:header;display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:30px;background-color:var(--dark-background);padding:15px}header .title{font-size:2.2rem}header .title a{color:var(--white-text)}@media only screen and (max-width: 768px){header .title{font-size:1.7rem}}header nav{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;gap:30px}header nav img{height:24px;filter:invert(100%) sepia(100%) saturate(0%) hue-rotate(305deg) brightness(102%) contrast(102%)}header nav button{border:none;background-color:transparent;display:flex;flex-direction:row;justify-content:center;align-items:center}header nav button#high-contrast-mode-button div{color:#fff;font-size:1.5rem;font-weight:700;text-align:center;vertical-align:middle}header nav button#high-contrast-mode-button.on div{color:#ff0}header nav .mode-switch{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;gap:5px}header nav .mode-switch .switch{position:relative;display:inline-block;width:48px;height:28px}header nav .mode-switch .switch input{opacity:0;width:0;height:0}header nav .mode-switch .switch .slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:var(--slider-background);-webkit-transition:.4s;transition:.4s}header nav .mode-switch .switch .slider:before{position:absolute;content:"";height:20px;width:20px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}header nav .mode-switch .switch .slider.round{border-radius:34px}header nav .mode-switch .switch .slider.round:before{border-radius:50%}header nav .mode-switch .switch input:checked+.slider{background-color:var(--slider-background)}header nav .mode-switch .switch input:focus+.slider{box-shadow:0 0 1px var(--slider-background)}header nav .mode-switch .switch input:checked+.slider:before{-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translate(20px)}header nav #dark-mode-button{display:none;margin-top:3px}header nav #menu-button{display:none}@media only screen and (max-width: 768px){header nav{gap:20px}header nav #dark-mode-switch{display:none}header nav #dark-mode-button,header nav #menu-button{display:inline-block}}aside{grid-area:aside;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:20px;background-color:var(--medium-background);padding:15px}aside>.title{font-size:1.6rem;margin-bottom:-8px}aside .section{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:8px}aside .section .header{display:flex;flex-direction:row;justify-content:space-between;align-items:flex-start;gap:15px}aside .section .header .title{font-size:1.15rem}aside .section .header button{flex-shrink:0;font-size:.85rem;padding:5px 6px;border:none;border-radius:0;background-color:var(--button-background);color:var(--button-text)}@media only screen and not (max-width: 768px){aside .section .header button:hover{background-color:var(--button-hover)}}aside .section .header button:disabled{background-color:var(--button-disabled-background);color:var(--button-disabled-text)}aside .section .items{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:4px}aside .section .items input[type=radio],aside .section .items input[type=checkbox]{margin-right:4px}aside .section .items:has(.slider){gap:10px}aside .section .items .slider{flex-direction:column;align-items:stretch;gap:2px}aside .section .items .slider .display input{flex-grow:1}@media only screen and (max-width: 768px){aside>.title{font-size:1.5rem}html:has(.menu-closed) aside{display:none}html:has(.menu-open) aside .section:has(input[type=checkbox],input[type=radio]) .items{display:grid;grid-template-columns:1fr 1fr;row-gap:6px}}.slider{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:20px}.slider .display{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;gap:5px}.slider .display .value{text-wrap:nowrap}main{grid-area:main;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:30px;background-color:var(--light-background);padding:15px 25px 25px}@media only screen and (max-width: 768px){html:has(.menu-open) main{display:none}}#visualisation-controls{display:grid;grid-template-columns:1fr 2fr 1fr;grid-template-areas:". controls info"}#visualisation-controls .controls{grid-area:controls;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;gap:10px}#visualisation-controls .controls .buttons{display:flex;flex-direction:row;justify-items:center;align-items:center;gap:3px}#visualisation-controls .controls .buttons button{height:2.2rem;padding:3px;border:none;border-radius:0;background-color:var(--control-button-background)}@media only screen and not (max-width: 768px){#visualisation-controls .controls .buttons button:hover{background-color:var(--control-button-hover)}}#visualisation-controls .controls .buttons button:disabled{background-color:var(--button-disabled-background)}#visualisation-controls .controls .buttons button img{width:100%;height:100%;filter:invert(100%) sepia(100%) saturate(0%) hue-rotate(305deg) brightness(102%) contrast(102%)}#visualisation-controls .controls .buttons button#playButton,#visualisation-controls .controls .buttons button#pauseButton,#visualisation-controls .controls .buttons button#stopButton{height:3rem}#visualisation-controls .controls .buttons button:disabled img{filter:opacity(25%)}#visualisation-controls .controls .buttons button.hidden{display:none}#visualisation-controls .controls .slider{width:clamp(120px,100%,500px);white-space:pre-line}#visualisation-controls .controls .slider .display,#visualisation-controls .controls .slider .display input{flex-grow:1}#visualisation-controls .info{justify-self:end;grid-area:info;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-end;font-size:.95rem}@media only screen and (max-width: 768px){#visualisation-controls .info{display:none}}@media only screen and (max-width: 768px){#visualisation-controls{grid-template-columns:1fr;grid-template-areas:"controls"}}#visualisation-display{display:grid;flex-grow:1;row-gap:20px;column-gap:50px;grid-auto-columns:1fr;grid-auto-rows:1fr}#visualisation-display .item{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:8px}#visualisation-display .item .header{display:flex;flex-direction:row;justify-content:space-between;align-items:flex-end}#visualisation-display .item .header .placing{font-size:1.1rem}#visualisation-display .item .header .placing.hidden{visibility:hidden}@media only screen and (max-width: 768px){#visualisation-display .item .header{flex-direction:column;justify-content:flex-start;align-items:flex-start}#visualisation-display .item .header .title{font-size:1.2rem;width:min-content;line-height:1.2;height:2.4em}#visualisation-display .item .header .placing{align-self:flex-end;margin-top:-1.2rem;font-size:.9rem}}#visualisation-display .item .chart{flex-grow:1}@media only screen and (max-width: 768px){#visualisation-display{row-gap:15px;column-gap:25px}}footer{grid-area:footer;display:flex;flex-direction:row;justify-content:center;align-items:flex-start;background-color:var(--dark-background);padding:7px 0 3px;font-size:.9rem}footer pre,footer a{color:var(--medium-text)}footer a{text-decoration:underline}footer a:hover{color:var(--medium-text-hover)}footer img{height:1rem;filter:invert(100%) sepia(100%) saturate(0%) hue-rotate(305deg) brightness(102%) contrast(102%)}
