.frame {
  position: absolute;
  display: flex;
  flex-direction: column;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #000;
  color: #DDD; }
  .frame--hidden {
    display: none; }
  .frame--framed {
    max-width: 60vh;
    margin: 1vh auto;
    border-radius: 3vh;
    border: 0.6vh solid #000;
    overflow: hidden;
    box-shadow: 0 0 8px #555; }

.grid__wrapper {
  position: relative;
  padding-top: 100%; }

.grid__svg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  pointer-events: none; }

.grid__outer-square {
  stroke: #666;
  stroke-width: 2;
  fill: none; }

.grid__outer-mask {
  stroke: black;
  stroke-width: 2;
  fill: none; }

.grid__square {
  stroke: #666;
  stroke-width: 2;
  fill: transparent;
  cursor: pointer;
  pointer-events: all; }

.grid__square-selected {
  stroke: aqua;
  stroke-width: 2;
  fill: none; }

.grid__light-source {
  stroke: none; }

.grid__light-segment {
  stroke-width: 3;
  stroke-linecap: round;
  fill: none;
  mix-blend-mode: lighten; }
  .grid__light-segment--intensity-medium {
    stroke-width: 2; }
  .grid__light-segment--intensity-low {
    stroke-width: 1; }

.grid__filter {
  stroke-width: 9;
  stroke-linecap: round;
  opacity: 0.75; }

.grid__reflector {
  stroke: url(#reflector-gradient);
  stroke-width: 3;
  stroke-linecap: round;
  opacity: 1; }
  .grid__reflector--reflectivity-none {
    opacity: 0; }
  .grid__reflector--reflectivity-minimal {
    opacity: 0.25; }
  .grid__reflector--reflectivity-half {
    opacity: 0.6; }
  .grid__reflector--no-filter {
    stroke-width: 4; }

* {
  box-sizing: border-box; }

html {
  font-family: sans-serif;
  font-size: min(2.8vh, 4.6vw); }

html, body {
  position: relative;
  margin: 0;
  padding: 0;
  height: 100%;
  color: #333;
  background-color: #DDD;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

p {
  margin: 0 0 0.5em 0; }
  p:last-of-type {
    margin-bottom: 0; }

button {
  font-size: 1em; }