:root {

    --sidebar-button-size: 70px;
    --sidebar-visuals-size: 40px;
    --chin-size: 25vh;
    --panel-padding-size: 20px;

}

.sidebar-button {

    position: absolute;
    height: var(--sidebar-button-size);
    width: calc(var(--sidebar-button-size) * 0.5);
    /*background-color: aquamarine;*/
    top: calc(50vh - calc(var(--sidebar-button-size) * 0.5));
    left: 0px;
    
}

.sidebar-button-visuals { 

    position: absolute;
    height:  calc(var(--panel-padding-size) * 3);
    width: calc(var(--panel-padding-size) * 0.5);

    left: calc(var(--panel-padding-size) * 0.25);
    top: calc((var(--sidebar-button-size) * 0.5) - var(--sidebar-visuals-size) * 0.5);

    border-radius: calc(var(--sidebar-visuals-size) * 0.3);

}


html {
    scrollbar-width: none; /* Firefox */
  }

  body::-webkit-scrollbar {
    width: 0px; /* Chrome, Safari, Edge */
}


.stable-scrollbar {
  scrollbar-gutter: stable;
}


body { /* Let a custom font take precedent for flags anywhere on the page! */
    font-family: "Twemoji Country Flags", var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"), serif;
}


/* Example: max width 200px */
.sidebar-tooltip:before {
  max-width: 180px;
  white-space: normal; /* allow wrapping */
}