:root{-webkit-user-select:none;user-select:none;width:100%;font-family:monospace;font-size:16px;position:fixed}body{margin:0;overflow:hidden}.checkmark[data-v-18c1ba09]{cursor:default}.status[data-v-18c1ba09]{opacity:0;pointer-events:none;position:absolute}.button-wrapper[data-v-558ac533]{position:relative}input[type=color][data-v-558ac533]{opacity:0;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}input[data-v-232f9270]{appearance:none;color:var(--text-color);text-transform:uppercase;background:0 0;border:1px solid #0000;border-radius:4px;width:100px;padding:0 16px;font-family:inherit;font-size:1rem}@media (any-hover:hover){input[data-v-232f9270]:hover{border:1px solid var(--border-color)}}input[data-v-232f9270]:focus-visible{outline:1px solid var(--border-color)}.checkmark[data-v-40876a58]{cursor:default}.status[data-v-40876a58]{opacity:0;pointer-events:none;position:absolute}h1{margin:0 0 16px}h2{margin:0}main{--padding:16px;text-align:start;flex-direction:column;width:100%;height:100dvh;display:flex;overflow:hidden}#foreground-input{--text-color:var(--foreground-text-color);--border-color:var(--foreground-text-color)}#background-input{--text-color:var(--background-text-color);--border-color:var(--background-text-color)}.results{padding:var(--padding)}.color-row{padding:calc(var(--padding) * .5) 0px;justify-content:space-between;align-items:center;display:flex}.button-group{display:flex}.app-icon{appearance:none;cursor:pointer;color:inherit;padding:var(--padding);text-transform:uppercase;background:0 0;border:none;border-radius:100%;outline:none;justify-content:center;align-items:center;height:100%;margin:0 6px;font-family:inherit;font-size:1.6rem;display:flex}.eyedropper-button{margin-right:0}@media (any-hover:hover){.foreground.color-row button:hover,.results button:hover{background:var(--background-text-color-tint)}.background.color-row button:hover{background:var(--foreground-text-color-tint)}.foreground.color-row button:focus-visible,.results button:focus-visible{background:var(--background-text-color-shade)}.background.color-row button:focus-visible{background:var(--foreground-text-color-shade)}}.main-content{background:var(--background);color:var(--background-text-color);padding-top:env(safe-area-inset-top);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);flex-direction:column;flex:1;justify-content:space-between;font-size:1.35rem;display:flex}.bottom-bar{background:var(--foreground);min-height:50px;color:var(--foreground-text-color);padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);align-items:center;display:flex}.bottom-bar .color-row{width:100%}.button-column{inset-inline-end:0;flex-direction:column;display:flex;position:absolute;top:8px}