/* v136: restore readable wordmarks and size the visible glyphs, not only their boxes. */

#stock-list .stock-card-head {
  grid-template-columns: 64px minmax(0, 1fr) minmax(96px, 112px) 14px !important;
}

#stock-list .stock-card .stock-logo,
#stock-list .stock-card.is-expanded .stock-logo {
  width: 64px !important;
  height: 34px !important;
}

#stock-list .stock-card .stock-logo span {
  padding-inline: 3px !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
}

#stock-list .stock-card[data-logo="LGENSOLU"] .stock-logo span,
#stock-list .stock-card[data-logo="CELTRIGON"] .stock-logo span {
  font-size: 8.5px !important;
}

.portfolio-position-logo {
  width: 60px !important;
  height: 32px !important;
  padding-inline: 2px !important;
  font-size: 8.5px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
}

.portfolio-position-row {
  grid-template-columns: 60px minmax(0, 1fr) minmax(96px, 110px) !important;
}

.portfolio-position-row[data-stock-id="lgensol"] .portfolio-position-logo,
.portfolio-position-row[data-stock-id="celtrigon"] .portfolio-position-logo {
  font-size: 8px !important;
}

#panel-stocks #action-buttons button,
#panel-stocks #action-buttons button.action-primary {
  min-height: 60px !important;
}

#panel-stocks #action-buttons button::before,
#panel-stocks #action-buttons button.action-primary::before {
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  flex-basis: 32px !important;
}

#panel-stocks #action-buttons button::after,
#panel-stocks #action-buttons button.action-primary::after {
  width: 24px !important;
  height: 24px !important;
}

#panel-stocks #action-buttons .action-label {
  font-size: 14px !important;
  line-height: 1.18 !important;
}

#panel-stocks #action-buttons .action-status {
  font-size: 12px !important;
  line-height: 1.18 !important;
}

#bottom-nav .nav-icon {
  box-sizing: border-box !important;
  width: 32px !important;
  min-width: 32px !important;
  max-width: 32px !important;
  height: 32px !important;
  display: grid !important;
  place-items: center !important;
}

#bottom-nav .nav-icon::before {
  width: 26px !important;
  height: 26px !important;
}

#bottom-nav .nav-label {
  font-size: 14px !important;
  line-height: 1.15 !important;
}

.topbar-btns svg {
  width: 24px !important;
  height: 24px !important;
}

.utility-action-icon {
  width: 42px !important;
  height: 42px !important;
}

.utility-action-icon::before {
  width: 24px !important;
  height: 24px !important;
}

.modal:not(#splash) .modal-actions button,
#daytrade-close-btn {
  min-height: 48px !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
}

#bonus-confirm-modal .modal-actions button {
  min-height: 48px !important;
  font-size: 15px !important;
}

#daytrade-start-btn,
#retirement-ending-confirm-btn {
  min-height: 48px !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
}

#notify-btn,
#save-open-btn,
#utility-sound-btn,
#help-btn,
#nickname-btn {
  min-height: 44px !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
}

.boost-choice-option {
  font-size: 14px !important;
}

@media (max-width: 520px) {
  #panel-stocks #action-buttons button,
  #panel-stocks #action-buttons button.action-primary {
    grid-template-columns: 32px minmax(0, 1fr) !important;
    column-gap: 9px !important;
  }

  #panel-stocks #action-buttons button::after,
  #panel-stocks #action-buttons button.action-primary::after {
    left: 26px !important;
  }
}

@media (max-width: 380px) {
  #stock-list .stock-card-head {
    grid-template-columns: 60px minmax(0, 1fr) minmax(90px, 104px) 12px !important;
  }

  #stock-list .stock-card .stock-logo,
  #stock-list .stock-card.is-expanded .stock-logo {
    width: 60px !important;
    height: 32px !important;
  }

  #stock-list .stock-card .stock-logo span {
    padding-inline: 2px !important;
    font-size: 8.5px !important;
  }

  #stock-list .stock-card[data-logo="LGENSOLU"] .stock-logo span,
  #stock-list .stock-card[data-logo="CELTRIGON"] .stock-logo span {
    font-size: 8px !important;
  }

  .portfolio-position-row {
    grid-template-columns: 56px minmax(0, 1fr) minmax(92px, 104px) !important;
  }

  .portfolio-position-logo {
    width: 56px !important;
    height: 30px !important;
    font-size: 8px !important;
  }

  .portfolio-position-row[data-stock-id="lgensol"] .portfolio-position-logo,
  .portfolio-position-row[data-stock-id="celtrigon"] .portfolio-position-logo {
    font-size: 7.75px !important;
  }

  #panel-stocks #action-buttons .action-label {
    font-size: 13.5px !important;
  }

  #panel-stocks #action-buttons .action-status {
    font-size: 11.5px !important;
  }
}

@media (min-width: 720px) {
  #stock-list .stock-card-head {
    grid-template-columns: 68px minmax(0, 1fr) minmax(96px, 112px) 14px !important;
  }

  #stock-list .stock-card .stock-logo,
  #stock-list .stock-card.is-expanded .stock-logo {
    width: 68px !important;
    height: 36px !important;
  }

  #stock-list .stock-card .stock-logo span {
    font-size: 9.5px !important;
  }

  #stock-list .stock-card[data-logo="LGENSOLU"] .stock-logo span,
  #stock-list .stock-card[data-logo="CELTRIGON"] .stock-logo span {
    font-size: 9px !important;
  }

  .portfolio-position-row {
    grid-template-columns: 64px minmax(0, 1fr) minmax(96px, 110px) !important;
  }

  .portfolio-position-logo {
    width: 64px !important;
    height: 34px !important;
    font-size: 9px !important;
  }

  .portfolio-position-row[data-stock-id="lgensol"] .portfolio-position-logo,
  .portfolio-position-row[data-stock-id="celtrigon"] .portfolio-position-logo {
    font-size: 8.5px !important;
  }
}

@media (min-width: 1280px) {
  #bottom-nav .nav-btn {
    grid-template-columns: 32px max-content !important;
    justify-content: center;
    gap: 1px !important;
  }
}

@media (min-width: 900px) and (max-width: 1279px) {
  #bottom-nav {
    min-height: calc(60px + env(safe-area-inset-bottom)) !important;
    padding: 3px 12px calc(3px + env(safe-area-inset-bottom)) !important;
  }

  #bottom-nav .nav-btn {
    min-height: 48px;
    gap: 1px !important;
  }
}