body{margin:0;font-family:Roboto Mono,monospace;font-size:18px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-width:21rem;overflow:hidden}html{overflow:hidden}._App_1utk3_1{display:flex;padding:4rem 1rem;font-family:Roboto Mono,monospace;height:100vh;box-sizing:border-box;overflow:auto;overscroll-behavior:none}._GlobalControls_1utk3_11{display:block;margin:0 auto;width:3rem;top:1rem;position:fixed}._GlobalControls_1utk3_11>button{margin-bottom:1rem}._Colors_1utk3_23{display:flex;flex-wrap:wrap;justify-content:center;align-self:flex-start;gap:1rem;margin-left:4rem;width:calc(100% - 4rem)}._BackgroundColorPopup_1utk3_33{position:fixed;background-color:#323232e6;width:17.5rem;padding:1rem;top:12rem;left:5rem}._BackgroundColorPopup_1utk3_33:after{content:"";position:absolute;right:100%;top:1.5rem;border-right:1rem solid rgba(50,50,50,.9);border-top:1rem solid transparent;border-bottom:1rem solid transparent}button{width:3rem;height:3rem;padding:0;border:none;border-radius:3rem;display:grid;place-items:center;background-color:#e6e6e6}button:hover{background-color:#ccc}button[disabled]{background-color:#e6e6e6;opacity:.4}img{width:1.875rem;height:1.875rem}._disabled_1utk3_77{opacity:.5}._ColorComponentControl_1g4hn_1{display:grid;grid-template-columns:1rem 8.5rem 4.5rem;column-gap:1rem;align-items:center}label{justify-self:center}input[type=number]{font-family:Roboto Mono,monospace;font-size:18px;border-radius:2px;border:1px solid transparent;padding-left:5px}input[type=range]{-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{background:#ebebeb;height:.5rem;border-radius:2px}input[type=range]::-moz-range-track{background:#ebebeb;height:.5rem;border-radius:2px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;height:1.7rem;width:1rem;background-color:#262626;margin-top:-.6rem;border-radius:2px;border:1px solid lightgray}input[type=range]::-moz-range-thumb{height:1.7rem;width:1rem;background-color:#262626;border-radius:2px;border:1px solid lightgray}._ColorControls_77rxm_1{display:flex;flex-direction:column;align-items:center;color:#fff;background-color:#0009;border-radius:2px}._ColorBlock_77rxm_10{height:10rem;width:100%;min-width:18rem;border-radius:2px}._ControlsContainer_77rxm_17{display:grid;grid-template-rows:auto auto;row-gap:1rem;padding:1rem}._InfoLine_77rxm_24{display:grid;grid-template-columns:1fr 1fr;justify-items:center;align-items:center}._HexInput_77rxm_31{width:5.5rem;height:2rem;font-family:Roboto Mono,monospace;font-size:18px;text-align:center;border-radius:2px;border:none}._ContrastRatio_77rxm_41 :first-child{font-weight:700}._ContrastRatio_77rxm_41 :last-child{color:#ffffff80}._Sliders_77rxm_49{display:flex;flex-direction:column;gap:.5rem}