
@media (orientation: landscape) {

  #btp-tsumego-content-container {
    top: 8vh;
    width: 136vh;
    max-width: 98vw;
  }

  #btp-tsumego-content {
    width: 130vh;
    max-width: 92vw;
    height: 80vh;
    max-height: 57vw;
    flex-direction: row;
  }

  #btp-board-container {
    width: 57%;
    height: 0;
    padding-bottom: 57%;
  }
  #btp-tsumego-controls-container {
    align-items: flex-end;
    width: 34%;
    height: 93%;
  }

  #btp-tsumego-logo-container {
    width: 100%;
    height: 7%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }

  #btp-logo-text {
    width: auto;
    height: 100%;
    font-size: min(6vh, 4.2vw);
    line-height: min(6vh, 4.2vw);
    font-weight: bold;
  }

  #btp-portrait-summary {
    display: none;
  }

  #btp-tsumego-info-container {
    width: 100%;
    height: 22%;
    border-radius: 2vh 2vh 0 0;
  }

  #btp-tsumego-info-favorite-container {
    width: 10%;
    height: 0;
    padding-bottom: 10%;
  }

  #btp-tsumego-info-link-container {
    right: 12.2%;
    width: 10%;
    height: 0;
    padding-bottom: 10%;
  }

  #btp-tsumego-info-left-container {
    width: 47%;
    height: 100%;
    right: 3%;
  }

  #btp-tsumego-info-title {
    position: relative;
    height: 25%;
    font-size: min(2vh, 1.4vw);
    line-height: min(2.9vh, 1.89vw);
    padding-top: 0.8vh;
  }

  .btp-tsumego-info-text {
    position: relative;
  }

  #btp-tsumego-info-player {
    justify-content: center;
    width: 70%;
    height: 28%;
    font-size: min(1.8vh, 1.3vw);
    line-height: min(2.9vh, 1.89vw);
  }

  #btp-tsumego-info-komi {
    width: 100%;
    height: 100%;
    justify-content: center;
    font-size: min(1.7vh, 1.2vw);
  }

  #btp-tsumego-info-captures {
    width: 100%;
    height: 100%;
    justify-content: center;
    font-size: min(1.7vh, 1.2vw);
  }

  #komi-captures-text-container {
    display: flex;
    width: 100%;
    height: 17%;
  }

  #komi-captures-container {
    flex-direction: row;
    width: 100%;
    height: 33%;
  }

  #tsumego-komi-container {
    width: 50%;
    height: 100%;
  }

  #tsumego-captures-container {
    width: 50%;
    height: 100%;
  }

  #tsumego-captures-white {
    margin-top: 5%;
    margin-bottom: 5%;
    margin-left: 5%;
    width: 45%;
    height: 84%;
  }

  #tsumego-captures-black {
    margin-top: 5%;
    margin-bottom: 5%;
    margin-right: 5%;
    width: 45%;
    height: 84%;
  }

  .komi-captures-text {
    font-size: min(2.3vh, 1.5vw);
    line-height: min(2.9vh, 1.89vw);
  }

  #btp-tsumego-info-komi {
  }

  #btp-tsumego-info-captures {
  }

  .btp-tsumego-shield-prize-text {
    font-size: min(1.7vh, 1.3vw);
    line-height: min(2.3vh, 1.76vw);
    color: var(--info-shield-prize-font-color);
  }

  #btp-tsumego-playlist-container {
    width: 100%;
    height: 14%;
  }

  .btp-tsumego-playlist-bold-text {
    font-size: min(1.75vh, 1.34vw);
    line-height: min(2.3vh, 1.76vw);
  }

  .btp-tsumego-playlist-normal-text {
    font-size: min(1.75vh, 1.34vw);
    line-height: min(2.3vh, 1.76vw);
  }

  #btp-tsumego-rated-switch-container {
    width: 90%;
    height: 6%;
    padding-right: 5%;
    padding-left: 5%;
    margin-top: -2%;
    margin-bottom: -1%;
  }

  #btp-tsumego-rated-switch-text {
    font-size: min(1.75vh, 1.34vw);
    line-height: min(2.3vh, 1.76vw);
  }

  #btp-tsumego-rated-switch-content {
    width: 18%;
  }

  #btp-tsumego-rated-switch-track {
    width: 90%;
    border-radius: 2vh;
  }

  #btp-tsumego-rated-switch-slide {
    width: 52%;
    border-radius: 50%;
  }

  .rated-switch-slide-off {
    left: 4%;
  }

  .rated-switch-slide-on {
    left: 46%;
  }

  #btp-tsumego-mini-icons {
    width: 100%;
    height: 9%;
  }

  .mini-icons {
    width: 16%;
    height: 100%;
    border-radius: 14%;
  }

  #btp-tsumego-comment-count-container {
    min-width: 26%;
    padding-left: 5%;
    padding-right: 5%;
    padding-top: 5%;
    padding-bottom: 2%;
    font-size: min(2vh, 1.6vw);
    line-height: min(2vh, 1.6vw);
  }

  #btp-tsumego-buttons {
    width: 100%;
    height: 10.6%;
  }

  .estimator-button-inactive {
    font-size: min(2.1vh, 1.5vw);
  }

  .estimator-button-active {
    font-size: min(2.5vh, 1.8vw);
  }

  #btp-tsumego-next-button {
    font-size: min(2.1vh, 1.5vw);
  }

  #btp-navigation-container {
    width: 100%;
    height: 12%;
  }

  #btp-playlist-modal-container {
    top: 10vh;
    width: 64vh;
    max-width: 53vw;
    height: 86vh;
    left: min(33vh, 23.5vw);
  }

  #btp-playlist-modal-close-icon {
    right: 0.5%;
  }


  #btp-comment-modal-container {
    position: absolute;
    top: 10vh;
    left: 1.3vw;
    bottom: 3vh;
    width: 130.8vh;
    max-width: 97vw;
  }

@keyframes comments-glidein {
  from {
    top: 25vh;
    opacity: 0;
  }
  to {
    top: 10vh;
    opacity: 0.98;
  }
}

@keyframes comments-glideout {
  from {
    top: 10vh;
    opacity: 0.98;
  }
  to {
    top: 25vh;
    opacity: 0;
  }
}

  #btp-comment-modal-back-icon {
    width: 4%;
    left: 1%;
  }

  #btp-comment-modal-close-icon {
    width: 6%;
    right: 0.6%;
  }

  #btp-comment-modal-discussion-loading-cover {
    top: 0;
    width: 38%;
  }

  #btp-comment-modal-focus-container {
    top: 0;
    left: 0;
    bottom: 0;
    width: 62%;
  }

  #btp-comment-modal-focus-wrapper {
    height: 100%;
    aspect-ratio: 1;
    max-width: 92%;
  }

  #btp-comment-modal-focus-board {
    width: 100%;
    aspect-ratio: 1;
  }

  #focus-board-animation-button {
    width: 15%;
    height: 15%;
    left: 42.5%;
    top: 42.5%;
  }

  #btp-comment-modal-discussion-container {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 38%;
    overflow: scroll;
  }

  #discussion-highlight-problem-text {
    line-height: 3.2vh;
    font-size: 2.4vh;
  }

  .discussion-highlight-tsumego-texts {
    line-height: 3.2vh;
    font-size: 2.4vh;
  }

  .discussion-first-level-containers {
    margin-top: 4vh;
    margin-bottom: 3vh;
  }

  .discussion-second-level-containers {
    margin-top: 3.4vh;
    margin-bottom: 2.4vh;
  }

  .discussion-second-level-parent-row {
    height: 2vh;
    margin-top: 1vh;
    margin-bottom: -0.3vh;
  }

  .discussion-second-level-parent-names {
    line-height: 2vh;
    font-size: min(1.9vh, 1.38vw);
    font-style: italic;
    font-weight: bold;
    margin-right: 0.3vh;
  }

  .discussion-second-level-parent-contents {
    line-height: 2vh;
    font-size: min(1.9vh, 1.38vw);
    font-style: italic;
    margin-left: 0.6vh;
    margin-right: 0.3vh;
  }

  .discussion-first-level-icon-containers {
    width: 22%;
    height: 13vh;
  }

  .discussion-first-level-icons {
    width: 75%;
  }

  .discussion-first-level-votes {
    width: 90%;
    height: 3.2vh;
  }

  .discussion-upvote-buttons {
    width: 20%;
  }

  .discussion-downvote-buttons {
    width: 20%;
  }

  .discussion-first-level-text-containers {
    min-height: 13vh;
    margin-top: 0.6vh;
    margin-bottom: 0.6vh;
    padding-left: 1.4vh;
    padding-right: 1.4vh;
  }

  .discussion-second-level-text-containers {
    min-height: 14vh;
    margin-top: 0.6vh;
    margin-bottom: 0.6vh;
    padding-left: 1.4vh;
    padding-right: 1.4vh;
  }

  .discussion-first-level-text-usernames {
    margin-top: 1.4vh;
    line-height: 2.4vh;
    font-size: 2.2vh;
  }

  .discussion-first-level-text-contents {
    line-height: 3.2vh;
    font-size: 2.4vh;
    margin-top: 0.3vh;
    margin-bottom: 1vh;
  }

  .discussion-first-level-text-likes {
    height: 2.3vh;
    line-height: 2vh;
    font-size: 2vh;
    margin-left: 1.2vh;
    margin-right: 0.3vh;
    margin-top: 0.3vh;
  }

  #discussion-write-container {
    width: 38%;
    min-height: 15%;
  }

  #discussion-write-field {
    width: 100%;
    min-height: 14vh;
  }

  #discussion-write-icon-container {
    width: 25%;
  }

  #discussion-write-icon {
    width: 70%;
  }

  #discussion-write-text-container {
    width: 75%;
  }

  #discussion-write-text-input-field {
    width: 88%;
    padding-left: 6%;
    padding-right: 6%;
  }

  #discussion-no-comments-container {
    min-height: 54vh;
  }


  .settings-option-contents {
    width: 22.8%;
  }

  .settings-option-tracks {
    width: 90%;
    border-radius: 2vh;
  }

  .settings-option-slides {
    width: 52%;
    border-radius: 50%;
  }


}
