/* Wayvren CSS
============================================================== */

html {
    height: 100%;
  }

  *,
  *:before,
  *:after {
    box-sizing: inherit;
  }
  body {
    font-family: sans-serif;
    line-height: 1.5;
    margin: 0;
    min-height: 100%;
    box-sizing: border-box;
    color: var(--regular-text-color);
    background-color: var(--page-background-color);
    font-size: 13px;
    display: grid;
    grid-template-rows: min-content auto min-content;
    margin-bottom: 30px;
  }
  button {
    font-family: inherit;
    margin: 0;
  }
  button:disabled,
  select:disabled,
  input:disabled,
  input:disabled + label.like-button,
  input:disabled + label.dislike-button {
    opacity: var(--disabled-opacity);
    pointer-events: none;
  }
  input {
    background-color: var(--page-background-color);
    color: var(--important-text-color);
  }
  input[type="checkbox"] {
    border-color: var(--unimportant-text-color);
    border-style: solid;
    border-width: 1px;
  }
  select {
    background-color: var(--page-background-color);
    color: var(--important-text-color);
    border-color: var(--unimportant-text-color);
    border-style: solid;
    border-width: 1px;
  }
  .rupee {
    width: 18px;
    height: 18px;
    stroke: currentColor;
    stroke-width: 1.3;
    stroke-linecap: round;
    stroke-linejoin: round;
    fill: none;
    position: static;
  }
  .feather {
    position: static;
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linejoin: round;
    stroke-linecap: round;
  }
  #center-container,
  #footer {
    display: flex;
    justify-content: center;
  }
  #footer{
    height: 200px;
  }
  #toolbar {
    display: grid;
    grid-template-columns: max-content auto max-content;
    padding-right: 10px;
    padding-left: 10px;
    height: 40px;
    width: 100%;
    max-width: 1360px;
    margin-bottom: 15px;
  }
  #toolbar-left {
    grid-area: 1 / 1 / 2 / 2;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: flex-start;
  }
  #toolbar-center {
    grid-area: 1 / 2 / 2 / 3;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-right: 10px;
    padding-left: 10px;
    max-width: 690px;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
  }
  #toolbar-right {
    grid-area: 1 / 3 / 2 / 4;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
  }
  .toolbar-button {
    width: 40px;
    padding: 0;
    position: static;
    background-color: rgba(0, 0, 0, 0);
    border-width: 2px;
    border-style: none;
    border-color: rgba(0, 0, 0, 0);
    color: var(--regular-text-color);
    height: 40px;
    padding-right: 0;
    padding-left: 0;
    font-size: 12px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
  }
  .rupee-button {
    position: static;
    padding: 0;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    font-size: 12px;
    color: var(--regular-text-color);
    background-color: rgba(255, 255, 255, 0);
    border-width: 2px;
    border-style: none;
    border-color: rgba(255, 255, 255, 0);
    padding-right: 10px;
    padding-left: 10px;
    height: 40px;
    font-family: sans-serif;
    text-decoration: none;
  }
  #Username {
    position: static;
    height: 40px;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding-right: 10px;
    padding-left: 10px;
    text-decoration: none;
    color: var(--regular-text-color);
  }
  #Navbar {
    grid-area: 2 / 1 / 3 / 2;
    height: min-content;
    display: grid;
    grid-template-rows: min-content min-content;
    padding-right: 30px;
    padding-left: 30px;
  }
  #Navbar-top {
    grid-area: 1 / 1 / 2 / 2;
    height: 40px;
    display: grid;
    grid-template-columns: min-content auto min-content;
    margin-bottom: 10px;
    width: 100%;
  }
  #Navbar-bottom {
    grid-area: 2 / 1 / 3 / 2;
    height: 40px;
  }
  #Navbar-top-left {
    width: auto;
    height: auto;
    display: flex;
    flex-direction: row;
    align-items: stretch;
  }
  .navbar-button {
    background-color: rgba(255, 255, 255, 0);
    font-size: 13px;
    color: var(--unimportant-text-color);
    font-family: sans-serif;
    padding-top: 0;
    padding-right: 16px;
    padding-bottom: 0;
    padding-left: 16px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: rgba(255, 255, 255, 0);
  }
  .navbar-button-activated {
    padding-right: 16px;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 16px;
    background-color: rgba(255, 255, 255, 0);
    font-family: sans-serif;
    font-size: 13px;
    color: var(--important-text-color);
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: var(--important-text-color);
    outline: none;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    text-decoration: none;
  }
  #Navbar-top-center {
    grid-area: 1 / 2 / 2 / 3;
  }
  #Navbar-top-right {
    grid-area: 1 / 3 / 2 / 4;
    width: auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    padding-right: 0;
  }
  #Navbar-top-right-detail {
    grid-area: 1 / 3 / 2 / 4;
    width: auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    padding-right: 0;
    visibility: hidden;
  }
  #search {
    position: static;
    width: 100%;
    font-size: 13px;
    background-color: rgba(255, 255, 255, 0);
    line-height: 2;
    border: 0;
    border-radius: 0;
    outline: 0;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: var(--important-text-color);
    -webkit-appearance: none;
  }
  #content {
    display: grid;
    grid-template-columns: 0fr 3fr 1fr;
    grid-template-rows: auto;
    max-width: 1360px;
    margin-right: auto;
    margin-left: auto;
    gap: 0px 15px;
  }
  .stamina_button,
  .stamina_placeholder,
  .berry_button,
  .berry_placeholder {
    position: static;
    display: flex;
    flex-direction: row;
    justify-content: center;
    text-decoration: none;
    color: var(--regular-text-color);
    padding-right: 10px;
    padding-left: 10px;
  }
  .stamina_placeholder,
  .berry_placeholder {
    visibility: hidden;
  }
  #stamina-readout,
  #rp-readout {
    white-space: nowrap;
    margin-left: 4px;
  }
  #content-left {
    grid-area: 1 / 1 / 2 / 2;
  }
  #content-center {
    grid-area: 1 / 2 / 2 / 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 1020px;
  }
  #content-right {
    grid-area: 1 / 3 / 2 / 4;
    margin-right: 15px;
  }
  .text-button-activated {
    text-decoration: none;
    color: var(--important-text-color);
    padding-right: 4px;
    padding-left: 4px;
    text-decoration-line: underline;
  }
  .text-button {
    text-decoration: none;
    color: var(--unimportant-text-color);
    padding-right: 4px;
    padding-left: 4px;
  }
  #modal-background,
  #warning-background {
    position: fixed;
    backdrop-filter: blur(1px);
    width: 100%;
    height: 100%;
    display: none; /*Change to flex with JS to show modal window*/
    flex-direction: row;
    align-items: center;
    justify-content: center;
    z-index: 1000;
  }
  #modal-window,
  #warning-window {
    border-width: 1px;
    border-style: solid;
    border-color: var(--unimportant-text-color);
    border-radius: 5px;
    padding: 10px;
    width: min-content;
    max-height: 100%;
    overflow: auto;
    z-index: 1001;
    background-color: var(--page-background-color)
  }
  #modal-exit {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: end;
    /*margin-bottom: 10px;*/
  }
  #warning-content {
    display: grid;
    grid-template-columns: min-content auto;
    grid-template-rows: min-content;
    grid-template-areas: 
      "exl txt"
      "dsm dsm"
      "chc chc";
    row-gap: 10px;
    column-gap: 10px;
    min-width: 300px;
  }
  .warning-dismissal {
    width: 100%;
    font-style: italic;
    text-align: center;
    grid-area: dsm;
  }
  .med-preview-img,
  .preview-img {
    width: 128px;
    height: 72px;
    object-fit: contain;
    background-color: var(--img-background);
  }
  .med-preview-img {
    width: 256px;
    height: 144px;
  }
  .topic-square-tile {
    display: flex;
    flex-direction: column;
    width: min-content;
  }
  .square-post-data > * {
    display: inline-block;
  }
  .wager-block {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .topic-list-tile,
  .topic-win-tile {
    display: grid;
    grid-template-columns: min-content auto min-content;
    grid-template-rows: auto auto;
    grid-template-areas: 
      "lt ct rt"
      "bg bg bg";
    margin-bottom: 0;
    margin: 5px;
    padding: 5px;
  }
  .topic-win-tile {
    background-color: var(--yw-button-background);
    border-width: 1px;
    border-style: solid;
    border-color: var(--yw-button-border);
    border-radius: 5px;
  }
  .pool-list-tile {
    display: flex;
    flex-direction: column;
    border-width: 1px;
    border-style: solid;
    border-color: var(--unimportant-text-color);
    border-radius: 5px;
    margin-top: 10px;
    padding: 5px;
    width: 100%;
  }
  .pool-title {
    color: var(--important-text-color);
    font-size: 20px;
    text-decoration: none;
  }
  .pool-status {
    font-size: 13px;
    margin-bottom: 5px;
  }
  .topic-tile-left {
    display: flex;
    grid-area: lt;
    flex-direction: row;
  }
  .topic-author {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    font-size: 12px;
  }
  .author-label {
    margin-right: 2px;
    font-size: 12px;
  }
  .topic-title {
    font-size: 16px;
    color: var(--link-color);
    text-decoration: none;
  }
  .topic-win,
  .topic-rank,
  .topic-date,
  .square-topic-date,
  .square-topic-rank,
  .topic-status {
    font-size: 12px;
  }
  .mb-win,
  .topic-win {
    background-color: var(--yw-button-background);
    border-width: 1px;
    border-style: solid;
    border-color: var(--yw-button-border);
    border-radius: 5px;
    padding: 0 2px;
    color: var(--important-text-color);
  }
  .topic-tile-center {
    margin-right: 5px;
    margin-left: 5px;
    display: flex;
    grid-area: ct;
    flex-direction: column;
    align-items: flex-start;
  }
  .topic-tile-right {
    display: flex;
    grid-area: rt;
    flex-direction: row;
    justify-content: center;
    margin-left: 15px;
    margin-right: 15px;
  }
  .right-tile-block {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-left: 3px;
    margin-right: 3px;
  }
  .vote-block {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    grid-template-areas: 
      "lt rt"
      "ct ct" 
      "bt bt";
    row-gap: 10px;
    column-gap: 20px;
    /*min-width: 120px;*/
    /*min-width: max-content;*/
    min-width: 170px;
    height: min-content;
  }
  .set-vote-block {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr;
    grid-template-areas: 
      "lt rt";
    row-gap: 6px;
    column-gap: 10px;
    width: 120px;
    height: min-content;
    margin: 10px 0 0 0;
  }
  .navbar-button:hover {
    border-bottom-color: var(--unimportant-text-color);
  }
  .user-link {
    text-decoration: none;
    color: var(--link-color);
  }
  .topic-source {
    font-size: 10px;
    display: flex;
    flex-direction: row;
    margin-left: 5px;
  }
  .detail-source-label {
    grid-area: 1 / 1 / 2 / 2;
    text-align: right;
  }
  .title-block {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
  }
  .source-link {
    text-decoration: none;
    color: var(--regular-text-color);
    font-size: 10px;
    margin-left: 4px;
    margin-bottom: 4px;
  }
  .text-button:hover,
  .pool-title:hover,
  .topic-source:hover,
  .source-link:hover,
  .topic-title:hover,
  .user-link:hover,
  .pool-link:hover,
  .tag-menu-link:hover,
  .text-button-right:hover,
  .scoreboard-button:hover,
  .scoreboard-title:hover,
  .content-link:hover,
  .detail-link:hover,
  .message-link:hover,
  .menu-link:hover,
  .reg-reset-link:hover,
  .main-thread-link:hover {
    text-decoration-line: underline;
  }
  .see-all-link {
    text-decoration: none;
    color: var(--unimportant-text-color);
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: rgba(255, 255, 255, 0);
    padding: 4px;
  }
  .see-all-link:hover {
    border-bottom-color: var(--unimportant-text-color);
  }
  .see-all-link:active {
    color: var(--important-text-color);
    border-bottom-color: var(--important-text-color);
  }
  .navbar-button:active {
    color: var(--important-text-color);
    border-bottom-color: var(--important-text-color);
  }
  .like-button,
  .detail-like-button,
  .dislike-button,
  .detail-dislike-button {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-self: center;
    background-color: var(--button-background);
    border-color: var(--button-border);
    border-style: solid;
    border-width: 1px;
    padding: 2px 0;
  }
  .like-button {
    grid-area: lt;
  }
  .dislike-button {
    grid-area: rt;
  }
  button {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-self: center;
    color: var(--important-text-color);
    background-color: var(--button-background);
    border-color: var(--button-border);
    border-style: solid;
    border-width: 1px;
    padding: 2px 10px;
    font-size: 13px;
    -webkit-appearance: none;
  }
  button:hover,
  label.like-button:hover,
  label.dislike-button:hover {
    border-color: var(--link-color);
  }
  button:active,
  label.like-button:active,
  label.dislike-button:active {
    transform: scale(0.98);
  }
  #modal-close,
  #modal-close:hover,
  #warning-close,
  #warning-close:hover {
    display: block;
    border-color: var(--link-color);
    background-color: transparent;
    border: none;
    -webkit-appearance: none;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
  }
  .warning-sign {
    grid-area: exl;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .warning-sign-shape {
    height: 50px;
    width: 50px;
    border-style: solid;
    border-radius: 50%;
    border-color: var(--rd-button-border);
    border-width: 2px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .warning-sign-text {
    line-height: 1;
    font-size: 45px;
    color: var(--rd-button-border);
  }
  .warning-text {
    grid-area: txt;
    font-weight: bold;
  }
  .warning-interact {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-self: center;
    column-gap: 10px;
    grid-area: chc;
  }
  .warning-button {
    font-size: 13px;
    font-weight: normal;
    flex-wrap: nowrap;
    white-space: nowrap;
  }
  .like-button-voted,
  .detail-like-button-voted {
    width: 55px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-self: center;
    background-color: var(--gr-button-background);
    border-color: var(--gr-button-border);
    border-style: solid;
    border-width: 1px;
    padding: 2px 10px;
  }
  a.like-button,
  label.like-button {
    -webkit-appearance: none;
    text-decoration: none;
    text-align: center;
    color: initial;
    font-size: 13px;
    line-height: normal;
    align-self: center;
    background-color: var(--button-background);
    border-color: var(--button-border);
    border-style: solid;
    border-width: 1px;
    padding: 2px 0;
  }
  a.dislike-button,
  label.dislike-button {
    -webkit-appearance: none;
    text-decoration: none;
    text-align: center;
    color: initial;
    font-size: 13px;
    line-height: normal;
    align-self: center;
    background-color: var(--button-background);
    border-color: var(--button-border);
    border-style: solid;
    border-width: 1px;
    padding: 2px 0;
  }
  .like-input:checked + label.like-button {
    background-color: var(--gr-button-background);
    border-color: var(--gr-button-border);
  }
  .dislike-input:checked + .dislike-button {
    background-color: var(--rd-button-background);
    border-color: var(--rd-button-border);
  }
  .like-input,
  .dislike-input {
    display: none;
  }
  .hedge-block {
    grid-area: ct;
    display: grid;
    grid-template-columns: min-content auto min-content;
    column-gap: 2px;
    width: 100%;
  }
  .hedge-input {
    text-align: center;
    font-size: 13px;
    width: 2.5em;
  }
  .hedge-slider {
    width: 100%;
    margin-left: 0px;
    margin-right: 0px;
  }
  .bet-input {
    text-align: center;
    font-size: 13px;
    width: 55px;
  }
  .bet-input,
  .wager-value-input,
  .hedge-input {
    padding: 2px;
    border-radius: 0;
    border-style: solid;
    border-width: 1px;
    border-color: var(--unimportant-text-color);
  }
  .bet-input-block {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-self: center;
    margin-bottom: 10px;
  }
  .bet-step-block {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-self: center;
  }
  .bet-step {
    padding: 0;
    font-size: 13px;
    width: 15px;
    height: 22px;
  }
  /*
  This block is for removing the spinner from the betting fields
  */
  input[type="number"]::-webkit-inner-spin-button,
  input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  input[type="number"] {
    -moz-appearance: textfield;
  }
  .hedge-result {
    grid-area: bt;
    text-align: center;
    width: 100%;
  }
  .bet-button {
    font-size: 13px;
    grid-area: bt;
    font-weight: normal;
    flex-wrap: nowrap;
  }
  a.bet-button {
    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;
    text-decoration: none;
    text-align: center;
    color: initial;
    font-size: 13px;
    margin-top: 3px;
    line-height: normal;
    padding-left: 8;
    padding-right: 8;
  }
  .see-more-lable1 {
    position: static;
    height: auto;
    width: auto;
    padding: 4px;
  }
  .pool-description {
    position: static;
    width: auto;
    height: auto;
    display: grid;
    grid-template-rows: auto;
    grid-template-columns: max-content auto max-content;
    grid-template-areas:
      "head head head"
      "main-left main-center main-right";
  }
  .pool-description-left {
    position: static;
    grid-area: main-left;
    width: auto;
    height: auto;
    display: flex;
    flex-direction: column;
  }
  .pool-description-center {
    grid-area: main-center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .pool-description-right {
    grid-area: main-right;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-right: 20px;
    padding-left: 20px;
    align-items: stretch;
  }
  .bet-winnings-label,
  .bet-balance-label {
    position: static;
    width: auto;
    height: auto;
    padding-right: 2px;
  }
  .bet-winnings-value,
  .bet-balance-value {
    position: static;
    width: auto;
    height: auto;
    padding-left: 2px;
    color: var(--important-text-color);
  }
  .powerblock {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
  }
  .stamina-boost {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
  }
  .stamina-boost-label {
    position: static;
    width: auto;
    height: auto;
    padding-right: 2px;
  }
  .powerup {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
  }
  .powerup-label {
    position: static;
    width: auto;
    height: auto;
    padding-right: 2px;
  }
  .rank-status {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
  }
  .rank-status-label {
    position: static;
    width: auto;
    height: auto;
    padding-right: 2px;
  }
  .powerup-button {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
  }
  .see-more-label {
    position: static;
    height: auto;
    width: auto;
    padding: 4px;
  }
  .see-whole-list {
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin: 5px;
  }
  .pool-link {
    text-decoration: none;
    color: var(--link-color);
  }
  .change-list-page {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    margin: 5px;
    width: 100%;
  }
  .text-button-right {
    text-decoration: none;
    color: var(--unimportant-text-color);
    padding-right: 4px;
    padding-left: 4px;
    border-left-style: solid;
    border-left-color: var(--unimportant-text-color);
    border-left-width: 1px;
  }
  .text-button-right-activated {
    padding-right: 4px;
    padding-left: 4px;
    border-left-style: solid;
    border-left-color: var(--unimportant-text-color);
    border-left-width: 1px;
    color: var(--important-text-color);
    text-decoration: none;
    text-decoration-line: underline;
  }
  .topic-index-label {
    color: var(--important-text-color);
    font-size: 20px;
  }
  .ordering {
    position: static;
    width: auto;
    height: auto;
    display: flex;
    flex-direction: row;
    margin-bottom: 5px;
  }
  .scoreboard-button {
    text-decoration: none;
    text-align: flex-end;
    color: var(--regular-text-color);
    padding-right: 4px;
    padding-left: 0px;
  }
  .bet-winnings-win,
  .bet-winnings,
  .bet-balance {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
  }
  .tag-filter {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 5px;
  }
  .tag-input-box {
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: center;
    width: 150px;
    height: 26.5px;
    border-width: 1px;
    border-style: solid;
    border-color: var(--unimportant-text-color);
  }
  .tag-search-input {
    border-style: none;
    box-sizing: border-box;
    width: 100%;
    min-width: 100px;
    -webkit-appearance: none;
  }
  .clear-tag {
    display: block;
    text-decoration: none;
    text-align: center;
    width: 20px;
    color: var(--unimportant-text-color);
  }
  .clear-tag:hover,
  .clear-tag:active {
    color: var(--important-text-color);
  }
  .tag-directory {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
  }
  .difficulty {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }
  .difficulty-label {
    padding-right: 2px;
  }
  .difficulty-select {
    padding-left: 2px;
  }
  .pool-scoreboard-tile {
    display: flex;
    flex-direction: column;
    border-width: 1px;
    border-style: solid;
    border-color: var(--unimportant-text-color);
    border-radius: 5px;
    margin-top: 10px;
    padding: 5px;
    width: 100%;
  }
  .scoreboard-description {
    position: static;
    width: auto;
    height: auto;
    display: grid;
    grid-template-rows: auto;
    grid-template-columns: repeat(3, minmax(max-content, 1fr));
    grid-template-areas:
      "head head head"
      "main-left main-center main-right";
    /* Change to the following grid-template column when filling
    the old difficulty place
    grid-template-columns: max-content auto max-content;
    */
  }
  .scoreboard-description-left {
    position: static;
    grid-area: main-left;
    width: auto;
    height: auto;
    display: flex;
    flex-direction: column;
  }
  .scoreboard-title,
  .scoreboard-head {
    color: var(--important-text-color);
    font-size: 20px;
    text-decoration: none;
  }
  .scoreboard-description-center {
    grid-area: main-center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-right: 20px;
    padding-left: 20px;
  }
  .scoreboard-description-right {
    grid-area: main-right;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-right: 20px;
    padding-left: 0;
    align-items: stretch;
  }
  #table {
    position: absolute;
    left: 100px;
    top: 531px;
    width: 159px;
    height: 52px;
    background: var(--img-background);
  }
  #thead {
    position: absolute;
    left: 98px;
    top: 542px;
    width: 64px;
    height: 25px;
    background: var(--img-background);
  }
  .scoreboard-header-cell {
    text-decoration: none;
    font-weight: 400;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: var(--scoreboard-border);
    font-size: 14px;
    padding-right: 5px;
    padding-left: 5px;
    color: var(--important-text-color);
    white-space: nowrap;
  }
  .scoreboard-spacer-cell {
    width: 50%;
  }
  .scoreboard {
    border-collapse: collapse;
    margin-right: 5px;
    margin-left: 5px;
  }
  .scoreboard-index-cell {
    font-size: 13px;
    padding-right: 5px;
    padding-left: 5px;
  }
  .scoreboard-post-cell {
    font-size: 13px;
    padding-right: 5px;
    padding-left: 5px;
  }
  .scoreboard-user-cell {
    font-size: 13px;
    padding-right: 5px;
    padding-left: 5px;
  }
  .scoreboard-number-cell {
    font-size: 13px;
    text-align: right;
    padding-right: 5px;
    padding-left: 5px;
  }
  .scoreboard-cell {
    font-size: 13px;
    text-align: center;
    padding-right: 5px;
    padding-left: 5px;
  }
  .scoreboard-col-wide {
    width: 100%;
  }
  .scoreboard-col-thin {
    width: max-content;
  }
  tr:nth-child(even) td {
    background: var(--scoreboard-alternate);
  }
  .post-detail-tile,
  .page-form-tile {
    display: flex;
    flex-direction: column;
    border-width: 1px;
    border-style: solid;
    border-color: var(--unimportant-text-color);
    border-radius: 5px;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 5px;
    width: 100%;
    align-items: flex-start;
  }
  .post-title {
    color: var(--important-text-color);
    font-size: 20px;
    margin-bottom: 5px;
  }
  .post-content {
    padding: 5px;
    width: 100%;
  }
  .temp-content-img {
    width: 640px;
    height: 360px;
    background-color: var(--img-background);
  }
  .content-img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    max-height: 549px;
    object-fit: scale-down;
  }
  .mb-graph-img {
    display: none;
    margin-left: auto;
    margin-right: auto;
    margin-top: auto;
    margin-bottom: auto;
    max-height: 549px;
    object-fit: scale-down;
  }
  .graph-img {
    display: block;
    max-width: 100%;
    object-fit: scale-down;
  }
  .dist-img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: auto;
    margin-bottom: auto;
    max-width: 100%;
    max-height: 549px;
    object-fit: scale-down;
  }
  .content-vid {
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    max-height: 549px;
    object-fit: scale-down;
    background-color: #000;
  }
  .iframe-format-parent {
    overflow: hidden;
    position: relative;
    padding-top: 56.25%;
    max-height: 549px;
    max-width: 976px;
    width: 100%;
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
  .content-iframe {
    position: absolute;
    top: 0;
    left: 0;
    border: 0;
    width: 100%;
    height: 100%;
  }
  .content-link {
    text-decoration: none;
    color:var(--link-color);
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    max-height: 549px;
  }
  .content-fig {
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: max-content;
    background-color: var(--img-background);
  }
  .content-fig-cap {
    text-align: center;
    background-color: var(--page-background-color);
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: var(--fig-border);
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: var(--fig-border);
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: var(--fig-border);
  }
  .post-info {
    margin-left: 5px;
    margin-top: 5px;
    margin-bottom: 5px;
    display: grid;
    grid-template-columns: max-content auto;
    grid-template-rows: max-content max-content max-content max-content max-content max-content max-content;
    gap: 5px 5px;
  }
  .detail-source-links {
    grid-area: 1 / 2 / 2 / 3;
    display: flex;
    flex-direction: column;
  }
  .detail-link {
    text-decoration: none;
    color: var(--link-color);
    width: min-content;
    white-space: nowrap;
  }
  .additional-links {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding-left: 15px;
  }
  .detail-author-label {
    grid-area: 2 / 1 / 3 / 2;
    text-align: right;
  }
  .detail-author-link {
    grid-area: 2 / 2 / 3 / 3;
  }
  .detail-rank-label {
    grid-area:  3 / 1 / 4 / 2;
    text-align: right;
  }
  .detail-rank {
    grid-area: 3 / 2 / 4 / 3;
  }
  .detail-stat {
    grid-area: 5 / 1 / 6 / 3;
  }
  .detail-stat-graph {
    grid-area: 6 / 1 / 7 / 3;
  }
  .detail-wager-label {
    grid-area: 5 / 1 / 6 / 2;
    text-align: right;
  }
  .detail-wager {
    grid-area: 5 / 2 / 6 / 3;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: flex-start;
  }
  .wager-form {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .wager-inputs {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    margin-bottom: 5px;
  }
  .wager {
    display: flex;
    flex-direction: row;
    margin-left: 10px;
  }
  .wager-label {
    grid-area: 3 / 1 / 4 / 2;
    text-align: right;
  }
  .wager-value-input {
    font-size: 13px;
    width: 55px;
    text-align: center;
    color: var(--important-text-color);
  }
  .wager-button {
    width: 100%;
    margin-top: 5px;
  }
  a.wager-button {
    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;
    text-decoration: none;
    text-align: center;
    color: initial;
    width: 100%;
    margin-top: 5px;
    line-height: normal;
  }
  .post-info-interaction {
    display: grid;
    grid-template-columns: auto min-content;
    grid-template-rows: auto;
    width: 100%;
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .post-interaction {
    grid-area: 1 / 2 / 2 / 3;
    display: flex;
    flex-direction: column;
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: var(--regular-text-color);
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 5px; /*Added for hedge display*/
  }
  .results-area {
    display: flex;
    flex-direction: column;
    padding-left: 20px;
    padding-right: 20px;
    width: min-content;
  }
  .vote-area {
    margin-top: 5px;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
  }
  .interaction-area {
    min-width: 141px;
    margin-bottom: 10px;
  }
  .interaction-area .wager-prompt {
    font-size: 14px;
    margin: 0;
  }
  .interaction-area > .vote-block {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr;
    grid-template-areas: 
      "lt rt";
    column-gap: 10px;
    min-width: 120px;
    height: min-content;
  }
  .interaction-area .bet-input-block {
    margin: 0;
  }
  .interaction-area .bet-button {
    margin-top: 10px;
  }
  .vt-btn {
    width: 100%;
  }
  .interaction-title {
    text-align: center;
    font-size: 16px;
    color: var(--important-text-color);
  }
  .results-score-title{
    font-size: 16px;
    color: var(--important-text-color);
  }
  .results-score-stats {
    margin-left: 20px;
  }
  .results-score-stats,
  .interaction-form {
    display: grid;
    grid-template-columns: max-content auto;
    gap: 5px 5px;
    grid-template-rows: repeat(auto-fit, auto);
  }
  .difficulty {
    grid-area: 1 / 2 / 2 / 3;
  }
  .balance-label {
    grid-area: 2 / 1 / 3 / 2;
  }
  .balance-value {
    grid-area: 2 / 2 / 3 / 3;
    text-align: center;
    color: var(--important-text-color);
  }
  .wager-input {
    grid-area: 3 / 2 / 4 / 3;
    display: flex;
    flex-direction: row;
    justify-content: center;
  }
  .results-winnings-label,
  .initial-bet-label {
    grid-area: 2 / 1 / 3 / 2;
    text-align: right;
  }
  .results-winnings-value,
  .initial-bet-value {
    grid-area: 2 / 2 / 3 / 3;
    text-align: right;
    color: var(--important-text-color);
  }
  .results-roi-label,
  .return-label {
    grid-area: 3 / 1 / 4 / 2;
    text-align: right;
  }
  .return-multiple {
    grid-area: 3 / 2 / 4 / 3;
    text-align: right;
    color: var(--important-text-color);
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: var(--regular-text-color);
  }
  .results-roi-value {
    grid-area: 3 / 2 / 4 / 3;
    text-align: right;
    color: var(--important-text-color);
  }
  .results-iscore-label {
    grid-area: 4 / 1 / 5 / 2;
    text-align: right;
  }
  .results-iscore-value,
  .payout-value {
    grid-area: 4 / 2 / 5 / 3;
    color: var(--important-text-color);
    text-align: right;
  }
  .results-score-label,
  .vote-label {
    grid-area: 5 / 1 / 6 / 2;
    text-align: right;
  }
  .vote-value {
    grid-area: 5 / 2 / 6 / 3;
    color: var(--important-text-color);
    text-align: right;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: var(--regular-text-color);
  }
  .results-score-value {
    grid-area: 5 / 2 / 6 / 3;
    color: var(--important-text-color);
    text-align: right;
  }
  .score-label {
    grid-area: 6 / 1 / 7 / 2;
    text-align: right;
  }
  .score-value {
    grid-area: 6 / 2 / 7 / 2;
    text-align: right;
    color: var(--important-text-color);
  }
  .cumulative-score {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    margin-top: 5px;
    margin-bottom: 5px;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: var(--fig-border);
    border-bottom-style: solid;
    border-bottom-color: var(--fig-border);
    border-bottom-width: 1px;
  }
  .cumulative-label {
    white-space: nowrap;
    margin-right: 5px;
  }
  .cumulative-value {
    color: var(--important-text-color);
  }
  .wager-decision {
    font-size: 16px;
    margin-top: 10px;
  }
  .wager-error {
    font-size: 16px;
    color: var(--rd-button-border);
    white-space: nowrap;
  }
  .wager-prompt {
    padding: 5px;
    font-size: 16px;
    color: var(--important-text-color);
    margin: 10px 0 10px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .q-like {
    color: var(--gr-button-border);
    font-style: italic;
  }
  .q-dislike {
    color: var(--rd-button-border);
    font-style: italic;
  }
  .wager-question {
    font-style: italic;
  }
  .game-rules,
  .about-rules {
    padding: 5px;
    font-size: 16px;
    color: var(--important-text-color);
    border-width: 1px;
    border-style: solid;
    border-color: var(--unimportant-text-color);
    border-radius: 5px;
    margin: 10px 0 10px 0;
  }
  .game-rules h1,
  .about-rules h1 {
    font-size: 20px;
    margin-block: 0;
    font-weight: normal;
  }
  .game-rules h2,
  .about-rules h2 {
    font-size: 18px;
    margin-block: 0;
    font-weight: normal;
  }
  .game-rules p,
  .about-rules p {
    margin-block: 10px;
  }
  summary > h2 {
    display: inline;
  }
  .rule-list {
    margin-block: 0;
    padding-inline-start: 40px;
  }
  .rule-list details,
  .rule-list li {
    margin: 10px 0;
  }
  .about-rules {
    border-style: none none solid;
    border-radius: 0;
  }
  .instructions {
    font-size: 16px;
    color: var(--important-text-color);
    margin-bottom: 10px;
  }
  .message-header {
    font-size: 20px;
    text-align: center;
    color: var(--important-text-color);
    margin-bottom: 5px;
  }
  .message {
    font-size: 18px;
    text-align: center;
    color: var(--important-text-color);
  }
  .message-link {
    text-decoration: none;
    color: var(--link-color);
    font-size: 18px;
    display: block;
    padding-top: 5px;
    padding-bottom: 5px;
  } 
  .toolbar-home {
    text-decoration: none;
    font-size: 20px;
    color: var(--important-text-color);
    /*display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;*/
    padding-right: 10px;
    padding-left: 10px;
    margin-top: auto;
    margin-bottom: auto;
  }
  .ver-home{
    font-size: 13px;
    color: var(--rd-button-border);
    vertical-align: super;
  }
  #Logout {
    position: static;
    height: 40px;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding-right: 10px;
    padding-left: 10px;
    text-decoration: none;
    color: var(--regular-text-color);
  }
  #Register {
    position: static;
    height: 40px;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding-right: 10px;
    padding-left: 10px;
    text-decoration: none;
    color: var(--regular-text-color);
  }
  #Login {
    position: static;
    height: 40px;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding-right: 10px;
    padding-left: 10px;
    text-decoration: none;
    color: var(--regular-text-color);
  }
  .link-imitate {
    all: unset;
    cursor: pointer;
  }
  .menu-link {
    width: min-content;
    white-space: nowrap;
    text-decoration: none;
    color: var(--link-color);
    font-size: 16px;
    display: block;
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .tag-menu-link {
    width: min-content;
    text-decoration: none;
    color: var(--link-color);
    font-size: 16px;
    display: block;
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .question {
    font-size: 16px;
    color: var(--important-text-color);
  }
  .user-form {
    width: 300px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .user-form-input,
  .bottom-user-form-input {
    font-size: 16px;
    width: 100%;
    margin-top: 5px;
    margin-bottom: 5px;
    border-radius: 0;
    border-style: solid;
    border-width: 1px;
    border-color: var(--unimportant-text-color);
  }
  .bottom-user-form-input {
    margin-bottom: 10px;
  }
  .reg-reset {
    width: 100%;
  }
  .reg-reset-link {
    text-decoration: none;
    color: var(--link-color);
  }
  .user-form-btn {
    font-size: 16px;
    margin-top: 5px;
    margin-bottom: 5px;
    color: var(--important-text-color);
    background-color: var(--button-background);
    border-color: var(--button-border);
    border-style: solid;
    border-width: 1px;
    padding: 2px 10px;
  }
  .user-form-btn:hover {
    border-color: var(--link-color);
  }
  .user-form-btn:active {
    transform: scale(0.98);
  }
  .form-error-msg {
    width: 100%;
    color: var(--rd-button-border);
    margin-top: 5px;
    margin-bottom: 5px;
    display: flex;
    flex-direction: column;
    align-items: start;
  }
  .error {
    color: var(--rd-button-border);
  }
  .mobile-detail,
  .mb-pool-description,
  .mb-scoreboard-title {
    display: none;
  }
  #mobilenav,
  #mobile-menu-tg,
  #mb-menu,
  #mb-menu-exit,
  #mb-title {
    display: none;
  }
  .mb-menu-button {
    text-decoration: none;
    color: var(--regular-text-color);
  }
  .link-like {
    cursor: pointer;
    width: min-content;
    white-space: nowrap;
  }
  .post-comments-tile {
    border-width: 1px;
    border-style: solid;
    border-color: var(--unimportant-text-color);
    border-radius: 5px;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 5px 20px 5px 5px;
    width: 100%;
  }
  .comments-title {
    color: var(--important-text-color);
    font-size: 20px;
    margin-bottom: 15px;
  }
  .main-thread-btn {
    font-size: 13px;
  }
  .main-thread-link {
    text-decoration: none;
    color: var(--link-color);
  }
  .comment {
    color: var(--important-text-color);
    padding-left: 5px;
  }
  .comment > summary {
    font-style: italic;
    color: var(--regular-text-color);
  }
  .comment[open] > summary {
    font-style: normal;
    color: var(--important-text-color);
  }
  .comment[data-comment-selected] > .comment-body > .comment-text,
  .comment:target > .comment-body > .comment-text {
    background-color: var(--yw-button-background);
    border-width: 1px;
    border-style: solid;
    border-color: var(--yw-button-border);
    border-radius: 5px;
  }
  .comment-info {
    font-size: 12px;
    margin-bottom: 5px;
  }
  .comment-author-link {
    font-weight: bold;
    text-decoration: none;
    font-size: inherit;
    color: inherit;
  }
  .comment-author-link:hover {
    color: var(--link-color);
  }
  .comment-interact-link {
    font-weight: bold;
    text-decoration: none;
    font-size: 12px;
    color: var(--important-text-color);
  }
  .comment-interact-link:hover,
  .comment-continue-link:hover,
  .fold-label:hover {
    color: var(--link-color);
  }
  .comment-body {
    border-left: 1px dotted;
    padding-left: 15px;
    font-size: 14px;
  }
  .comment-text {
    max-width: 75ch;
    min-width: 45ch;
    overflow-wrap: break-word;
  }
  .comment-text > p {
    margin: 5px 0;
  }
  .comment-text > :first-child {
    margin-top: 0;
  }
  .comment-text > :last-child {
    margin-bottom: 0;
  }
  .comment-interact {
    margin-top: 5px;
    margin-bottom: 10px;
    display: flex;
    flex-flow: row wrap;
  }
  .comment-interact > * {
    margin: 0 5px;
  }
  .comment-interact > :first-child {
    margin-left: 0;
  }
  .comment-interact > :last-child {
    margin-right: 0;
  }
  .comment-continue-link {
    display: block;
    text-decoration: none;
    cursor: pointer;
    font-weight: bold;
    font-size: 14px;
    color: var(--important-text-color);
    margin-bottom: 10px;
  }
  .fold-label {
    cursor: pointer;
    font-weight: bold;
    font-size: inherit;
    color: inherit;
  }
  .md-spoiler-text {
    border-radius: 2px;
    transition: background ease-out 1s, color ease-out 1s;
  }
  /*Hide all the checkboxes used for toggles*/
  .invisible-check,
  .stat-check,
  .spoiler-check,
  .fold-check {
    display: none;
  }
  .topic-tile-big {
    display: none;
    grid-area: bg;
    padding: 5px;
    width: 100%;
  }
  .invisible-check:checked ~ .topic-tile-big {
    display: block;
  }
  .detail-stat-graph,
  .hide-label {
    display: none;
  }
  .stat-check:checked ~ * .detail-stat-graph {
    display: block;
  }
  .stat-check:checked ~ * .hide-label {
    display: block;
  }
  .stat-check:checked ~ * .see-label {
    display: none;
  }
  .fold-check ~ .comment {
    display: none;
  }
  .fold-check:checked ~ .fold-label {
    display: none;
  }
  .fold-check:checked ~ .comment {
    display: block;
  }
  .spoiler-check + .md-spoiler-text {
    color: transparent;
    /*Use dark mode img-background*/
    background: var(--alt-img-background);
    cursor: pointer;
  }
  .spoiler-check:checked + .md-spoiler-text {
    color: inherit;
    /*Use light mode img-background*/
    background: var(--img-background);
    cursor: text;
  }
  .mb {
    display: none;
  }
  @media only screen and (max-width: 768px) {
    .stat-check:checked ~ * .detail-stat-graph {
      display: none;
    }
    .post-content {
      display: grid;
      grid-template-columns: 100%;
    }
    .stat-check:checked ~ * .mb-graph-img {
      display: block;
      grid-area: 1 / 1 / 2 / 2;
      border-width: 1px;
      border-style: solid;
      border-color: var(--unimportant-text-color);
      border-radius: 5px;
    }
    .stat-check:checked ~ * .content-iframe,
    .stat-check:checked ~ * .content-vid,
    .stat-check:checked ~ * .content-img,
    .stat-check:checked ~ * .content-link {
      filter: blur(1px);
      z-index: -1;
      grid-area:  1 / 1 / 2 / 2;
    }
    .stamina_placeholder,
    .berry_placeholder,
    .no-mb,
    .game-rules,
    .pool-title {
      display: none;
    }
    #content-right {
      margin-right: 0px;
    }
    #mb-title {
      position: static;
      grid-area: head;
      width: auto;
      height: auto;
      display: flex;
      flex-direction: column;
    }
    #mb-pool-title {
      color: var(--important-text-color);
      font-size: 20px;
      text-decoration: none;
    }
    .scoreboard-description-center,
    .scoreboard-description-right {
      display: none;
    }
    .pool-description-right {
      padding-left: 0%;
      padding-right: 0%;
    }
    .scoreboard-button {
      padding-left: 0px;
      text-align: start;
    }
    .difficulty,
    .tag-filter {
      justify-content: flex-start;
    }
    .mb-pool-description,
    .mb {
      display: block;
    }
    .mb-scoreboard-title {
      display: block;
      max-width: 85vw;
    }
    .detail-link {
      display: inline-block;
      max-width: 100px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    #mb-pool-title:hover {
      text-decoration-line: underline;
    }
    #username,
    #logout,
    #search,
    #display-mode-label {
      display: none;
    }
    #content {
      display: grid;
      grid-template-columns: 0fr auto 0fr;
      grid-template-rows: auto;
      max-width: 1360px;
      margin-right: 0px;
      margin-left: 0px;
      gap: 0px 15px;
      filter: none;
    }
    .topic-tile-right,
    .topic-win,
    .topic-author,
    .topic-rank,
    .topic-date,
    .topic-status,
    .source-link {
      display: none;
    }
    .topic-title {
      font-size: 14px;
      color: var(--link-color);
      text-decoration: none;
    }
    .mobile-detail {
      font-size: 12px;
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
    }
    .mb-win,
    .mb-author,
    .mb-date,
    .mb-rank {
      margin-right: 5px;
    }
    .mb-interact {
      width: 100%;
      display: flex;
      flex-direction: row;
      margin-top: 5px;
    }
    .like-button,
    a.like-button,
    .like-button-voted,
    .dislike-button,
    a.dislike-button,
    .dislike-button-voted,
    .bet-button,
    .bet-input {
      margin-top: 0px;
      margin-bottom: 0px;
    }
    #mobilenav {
      display: inline-block;
      padding-right: 10px;
      padding-left: 10px;
    }
    #mobilenav label {
      font-size: 20px;
    }
    #mb-menu div {
      display: block;
      width: 100%;
      margin-bottom: 10px;
      font-size: 14px;
    }
    #mb-menu {
      display: none;
      position: absolute;
      top: 40px;
      box-sizing: border-box;
      width: 100%;
      left: 0;
      padding-right: 20px;
      padding-left: 20px;
      background: white;
      border-bottom-right-radius: 5px;
      border-bottom-left-radius: 5px;
      box-shadow: 0px 5px 5px 0px #54595d;
      z-index: 999;
    }
    #mb-menu-exit {
      display: none;
      width: 100%;
      height: 100%;
      z-index: 998;
      background: transparent;
    }
    #mb-search input {
      width: 100%;
      font-size: 14px;
    }
    #mobile-menu-tg:checked ~ #mb-menu {
      display: block;
    }
    #mobile-menu-tg:checked ~ #mb-menu-exit {
      display: block;
    }
    #mobile-menu-tg:checked ~ #content {
      filter: blur(1px);
      z-index: 0;
      position: fixed;
      top: 55px;
    }
    .comment-text {
      max-width: 40ch;
      min-width: 35ch;
    }
  }