*,*:before *:after{box-sizing:border-box}html,body{margin:0;padding:0}html{height:100%}textarea,button,input{font:inherit}@font-face{font-family:Crimson Pro;font-style:normal;font-weight:400;src:url(/fonts/CrimsonPro-Regular.ttf)}@font-face{font-family:Crimson Pro;font-style:italic;font-weight:400;src:url(/fonts/CrimsonPro-Italic.ttf)}@font-face{font-family:Crimson Pro;font-style:normal;font-weight:600;src:url(/fonts/CrimsonPro-SemiBold.ttf)}@font-face{font-family:Courier Prime;font-style:normal;font-weight:400;src:url(/fonts/CourierPrime-Regular.ttf)}h1{font-size:2rem;line-height:1}h2{font-size:1.625rem;line-height:1.2}h3{font-size:1.29rem;line-height:1.3}h4,h5,h6{font-size:1.04rem;line-height:1.4}:root{--font-mono: "Courier", "Courier Prime", monospace;--font-body: "Crimson Pro", serif;--color-accent: seagreen}body{background-color:#f9f9f9;font-family:var(--font-body);line-height:1.5;min-height:100%;display:flex;flex-direction:column;gap:2rem}input{accent-color:var(--color-accent);color:#fff}hr{border:1px solid rgb(220,220,220);margin-bottom:1em}button{line-height:1.5;cursor:pointer;border-color:transparent;border-radius:5px;display:block;font-size:1em}button:disabled{color:#999;background-color:#eee;cursor:default}.toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem}.toolbar.toolbar--full button{flex:1;padding:.5em .75em}.text--toolbar{flex-wrap:wrap}.toolbar-section{display:flex;gap:.25rem}.toolbar-section+.toolbar-section{padding-left:.5rem;border-left:.5px solid #999}.button-with-icon{display:inline-flex;gap:.25em;align-items:center;justify-content:center;background:none;color:#000;line-height:1;white-space:pre}.button-with-icon:disabled{background:none}.button-with-icon .box{width:1.2em;height:1.2em}.button-with-icon .glyph{background-color:#000}.button-with-icon:disabled .glyph{background-color:#999}.button-with-icon:not(:disabled):hover{color:var(--color-accent)}.button-with-icon:not(:disabled):hover .glyph{background-color:var(--color-accent)}#detailBtn.expand .glyph{--icon: url(/icons/expand.svg)}#detailBtn.collapse .glyph{--icon: url(/icons/collapse.svg) }#randomiseBtn .glyph{--icon: url(/icons/randomise.svg)}@media (prefers-reduced-motion: no-preference){#randomiseBtn .box{transform:rotate(360deg);transition:.15s}#randomiseBtn.clicked .box{transform:rotate(0);transition:0s}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.box{width:1em;height:1em;position:relative}.glyph{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;-webkit-mask:var(--icon) center no-repeat;mask:var(--icon) center no-repeat;background-color:currentColor}.hidden{display:none}.invisible{visibility:hidden}header,main,footer{margin-inline:1rem;width:calc(100vw - 2rem)}@media (min-width: 800px){header,main,footer{max-inline-size:800px;margin-inline:auto}header{margin-block-start:2rem}footer{margin-block-end:2rem}}footer{color:#737373}footer a{color:inherit}footer a:hover{color:#444}footer>*+*{border-left:1px solid currentColor;padding-left:.6rem;margin-left:.5rem}main{flex:1;display:flex;flex-direction:column;justify-content:center}.text{margin-block:2rem;font-size:2rem}
