/* This has to be redone basically from scratch because there are issues with position:fixed without editing the tiddler frame z-index, which can't be done via CSS only (no parent selector) */

input.PIP-Select, input.PIP-Select+label, div.PIP-Select > input, div.PIP-Select > label, div.PIP-Select > span { width: 1.25em; height: 1.25em; font-size: 1.50em; vertical-align: middle; }

/*
input[type="radio"].PIP-Select[value="↗️"]:checked ~ div { border: 3px solid red; }
input[type="radio"].PIP-Select[value="↘️"]:checked ~ div { border: 3px solid blue; }
*/

/* Set PIP properties common to all position */
/*
input[type="radio"].PIP-Select[value]:not(input[type="radio"].PIP-Select[value="❎"]):checked,
input[type="radio"].PIP-Select[value]:not(input[type="radio"].PIP-Select[value="❎"]):checked ~ input,
input[type="radio"].PIP-Select[value]:not(input[type="radio"].PIP-Select[value="❎"]):checked ~ label,
*/
input[type="radio"].PIP-Select[value]:not(input[type="radio"].PIP-Select[value="❎"]):checked ~ input[type="radio"].PIP-Select[value="❎"],
input[type="radio"].PIP-Select[value]:not(input[type="radio"].PIP-Select[value="❎"]):checked ~ div {
  position: fixed;
  z-index: 99999;
  top: 0px;
  right: 0px;
}

input[type="radio"].PIP-Select[value]:not(input[type="radio"].PIP-Select[value="❎"]):checked ~ input[type="radio"].PIP-Select[value="❎"] { z-index: 100001; }

input[type="radio"].PIP-Select[value]:not(input[type="radio"].PIP-Select[value="❎"]):checked ~ div {
  /*height: 100vh;*/
  width: 50vw;
  background: white;
}