:root {
  /* Colors */
  /* https://farbvelo.elastiq.ch/?s=eyJzIjoiZTBjNjIyMTdiNTcxZSIsImEiOjYsImNnIjo0LCJoZyI6dHJ1ZSwiaGIiOmZhbHNlLCJobyI6ZmFsc2UsImhjIjpmYWxzZSwiaHQiOmZhbHNlLCJiIjpmYWxzZSwicCI6MC4xNzUsIm1kIjo2MCwiY20iOiJsYWIiLCJmIjoiTGVnYWN5IiwiYyI6ImhzbHV2Iiwic2MiOmZhbHNlLCJidyI6dHJ1ZSwiYWgiOmZhbHNlLCJpdSI6IiIsImxtIjp0cnVlLCJzbSI6ZmFsc2UsImN2IjoiaGV4IiwicW0iOiJhcnQtcGFsZXR0ZSIsIm5sIjoiYmVzdE9mIn0= */
  --moonscape: #7f6c71;
  --grandma’s-pink-tiles: #e1bac0;
  --cinderella: #f8d1c6;
  --young-apricot: #f8d7b6;
  --cereal-flake: #f0d8ad;
  --oatmeal: #cdc5b9;

  /* https://farbvelo.elastiq.ch/?s=eyJzIjoiZmZjY2JkZDg2ZjEzYiIsImEiOjYsImNnIjo0LCJoZyI6dHJ1ZSwiaGIiOmZhbHNlLCJobyI6ZmFsc2UsImhjIjpmYWxzZSwiaHQiOmZhbHNlLCJiIjpmYWxzZSwicCI6MC4xNzgzMDcwODQxNjMzNDY2LCJtZCI6NjAsImNtIjoibGFiIiwiZiI6IkxlZ2FjeSIsImMiOiJoc2x1diIsInNjIjpmYWxzZSwiYnciOnRydWUsImFoIjpmYWxzZSwiaXUiOiIiLCJsbSI6dHJ1ZSwic20iOmZhbHNlLCJjdiI6ImhzbCIsInFtIjoiYXJ0LXBhbGV0dGUiLCJubCI6ImJlc3RPZiJ9 */
  --made-in-the-shade: #67717c;
  --misty-mountains: #b8cce0;
  --lucid-dreams: #c7e6f4;
  --icy-breeze: #c2eff1;
  --crushed-ice: #bdf5ed;
  --water-leaf: #b7efe7;

  /* https://farbvelo.elastiq.ch/?s=eyJzIjoiODJiN2FjMjU1ODRiOCIsImEiOjYsImNnIjo0LCJoZyI6dHJ1ZSwiaGIiOmZhbHNlLCJobyI6ZmFsc2UsImhjIjpmYWxzZSwiaHQiOmZhbHNlLCJiIjpmYWxzZSwicCI6MC4yMTkxOTgyMDcxNzEzMTQ3LCJtZCI6NjAsImNtIjoibGFiIiwiZiI6IkxlZ2FjeSIsImMiOiJoc2x1diIsInNjIjpmYWxzZSwiYnciOnRydWUsImFoIjpmYWxzZSwiaXUiOiIiLCJsbSI6dHJ1ZSwic20iOmZhbHNlLCJjdiI6ImhleCIsInFtIjoiYXJ0LXBhbGV0dGUiLCJubCI6ImJlc3RPZiJ9 */
  --wizards-brew: #9d8bb3;
  --innocent-snowdrop: #cec0fa;
  --foggy-plateau: #d5d2fb;
  --puffy-cloud: #dce3fb;
  --diamond-white: #e1f4fb;
  --delicate-cloud: #d9dbe4;
}
:root {
  /* Colors */
  --color-1: oklch(4.1308% 0.25306 109.22);
  --color-2: oklch(98.369% 0.01834 67.664);
  --color-3: oklch(26.787% 0.00168 186.65);
  --accent: oklch(86.947% 0.25527 28.789);

  --bg-color: var(--color-2);
  --text-color: var(--color-1);
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg-color: var(--color-3);
    --text-color: var(--color-2);
  }
}
:root {
  font-family: "Inter", sans-serif;
  font-size: var(--fs-base);
}
@supports (font-variation-settings: normal) {
  :root {
    font-family: "InterVariable", sans-serif;
    font-feature-settings:
      /* "zero" 2, */ "ss03" 2;
    font-optical-sizing: auto;
  }
}
/***********************************
 * Base
 ***********************************/
body {
  background-color: oklch(from var(--bg-color) calc(l - 0.025) c h);
  color: var(--text-color);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: 100dvh;
}
/***********************************
 * Main
 ***********************************/
main {
  display: grid;
  gap: var(--space-2xs);
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: auto;
  height: 100dvh;
  overflow: hidden;
  padding: var(--space-md) var(--space-md);

  /* TODO: & iframe {
    border-radius: 6px;
  }*/
}
/***********************************
 * Elements
 ***********************************/
iframe[src*="/artwork-controller/"] {
  grid-column: 3;
  height: 100%;
  justify-self: end;
  max-width: var(--container-3xs);
  width: 100%;
}
iframe[src*="/browser/"] {
  grid-column: 1 / span 2;
  grid-row: 1 / span 2;
  height: 100%;
  justify-self: end;
  width: 100%;
}

/*# sourceMappingURL=./index.css.map */