/* VARIABLES */

:root {
  --scroll-bar-color: #8885;
  --scroll-bar-color-hover: #888;
  --error: #E54B4B;
  --background: #201c1b;
  --panel: #2b2827;
  --block: #33302f;
  --blockLight: #3c3936;
  --prominent: #3f3431;
  --overlay: #464342;
  --text: #c4b6ab;
  --link: #c48d66;
  --linkHover: #e9ceba;
  --linkVisited: #a07150;
  --dim: #92857a;
  --maximum: #fff;
  --accent: #a5a664;
  --user: #a5a664;
  --userHover: #edeec7;
  --character: #968ebd;
  --characterHover: #d7d3ec;
  --whisper: #302f33;
  --new: gold;
  --buttonBg: #634b41;
  --buttonBgHover: #705343;
  --buttonTxHover: #dacfc6;
  --inputBg: #2a2625;
  --heart: #b66767;
  --frown: #b68e67;
  --thumb: #b6b367;
  --laugh: #83b667;
  --fontSizeBase: 19px;
  --bodyFont: 'Alegreya Sans', Arial, Helvetica, sans-serif;
  --headlineFont: 'Alegreya', 'Times New Roman', Times, serif;
}

/* BASICS */

code {
  font-size: 17px;
  background: black;
  color: #AAA;
}
hr {
	border-top: 1px solid var(--overlay);
}

/* FORM */

input[type=text], input[type=email], input[type=password], textarea, input[type=checkbox] {
  font-size: 20px;
}

textarea, .ProseMirror {
  font-size: 20px;
}

select {
  font-size: 18px;
}

/* SVELTE-SELECT */

.svelte-select {
  --font-size: 20px;
}

/* TABS */

.tabs a, .tabs button {
  font-size: 22px;
}

/* POST CONTENT */

.post .content {
  font-size: 20px;
}

/* WYSIWYG Editor - TipTap/ProseMirror */

.ProseMirror {
  font-size: 20px;
}

/* COMPONENT OVERRIDES */

.headline.pinned {
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
  clip-path: polygon(0 0, 100% 0, 100% 200%, 0 200%);
}

/* UTILS */

.flex {
  display: flex;
  align-items: center;
}

/* MOBILE OVERRIDES */

@media (max-width: 768px) {
  body, a { font-size: 18px }
  h1 { font-size: 30px }

  .tabs a.active, .tabs button.active {
    font-size: 18px;
  }
}

@media (max-width: 500px) {
  .tabs a, .tabs button {
    font-size: 18px;
    height: 45px;
  }
}