[hidden] { display: none !important; }
#account-status { margin: 16px 0; font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.profile-box + #account-status { text-align: center; }
#logout { font: inherit; background: transparent; border: 0; }
.user-email .text { overflow-wrap: anywhere; }
.top-side .input-text a { padding: 8px 12px; color: var(--main-color); }
.top-side .input-text input { min-width: 0; }
.top-side .input-text button { flex-shrink: 0; }
.top-side .input-text { flex-wrap: wrap; gap: 8px; }
.top-side .input-text input { flex: 1 1 150px; }
.top-side .input-text button { margin-left: 0; min-height: 38px; }
.profile-box .left-side { flex: 0 0 360px; }
.profile-box .right-side { min-width: 0; }
@media (max-width: 1176px) {
    #main:has(.profile-box) { padding: 105px 16px 40px; height: auto; min-height: 100vh; }
    .profile-box { display: flex; flex-direction: column; margin-bottom: 20px; gap: 12px; }
    .profile-box .left-side, .profile-box .right-side { flex: auto; width: 100%; margin: 0; min-width: 0; }
    .profile-box .main-user { min-width: 0; overflow-wrap: anywhere; }
    .profile-box .sub-text { width: auto; }
    .profile-box .top-side { flex-direction: column; gap: 20px; }
    .profile-box .user-key { margin: 0; }
    .profile-box .container { overflow: visible; }
}

.profile-box .sub { min-height: 90px; padding: 12px; background-size: 62px auto, cover; }
.profile-box .sub > .sub-text { padding-left: 78px; font-size: 13px; font-weight: 400; line-height: 1.5; }
.profile-box .sub-text .text { font-size: 13px; }
.profile-box .sub-text .title { font-size: 14px; font-weight: 600; }
.profile-box .sub-text h4 { font-size: inherit; font-weight: inherit; }