.account-row {
  grid-template-columns: minmax(170px, 1.4fr) minmax(115px, .7fr) minmax(115px, .7fr) 100px 62px minmax(380px, auto);
  gap: 14px;
}

.login-status { justify-self: start; white-space: nowrap; }
.login-status.pending { background: rgba(40, 120, 255, .12); color: #7babff; }
.login-status.warning { background: rgba(255, 183, 77, .12); color: #ffc66d; }
.login-status.danger { background: rgba(255, 100, 124, .12); color: #ff91a2; }

#zhihu-login-dialog { padding: 16px; }
#zhihu-login-dialog .zhihu-login-dialog {
  box-sizing: border-box;
  width: min(1600px, calc(100vw - 32px)) !important;
  height: min(940px, calc(100vh - 32px));
  height: min(940px, calc(100dvh - 32px));
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  display: grid;
  grid-template-rows: auto auto minmax(260px, 1fr) auto auto;
  overflow: hidden;
}
#zhihu-login-dialog[data-mode="website"] .zhihu-login-dialog { grid-template-rows: auto auto auto minmax(260px, 1fr) auto auto; }

.zhihu-login-status { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.zhihu-login-status p { margin: 0; color: #9badc7; font-size: .84rem; }
.zhihu-browser-controls { display: grid; gap: 9px; margin-bottom: 12px; padding: 11px; border: 1px solid #203958; border-radius: 12px; background: #091629; }
.zhihu-browser-nav, .zhihu-browser-input { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.zhihu-browser-controls .button { height: 34px; padding: 0 11px; font-size: .7rem; }
.zhihu-browser-url { min-width: 0; overflow: hidden; padding: 7px 10px; border-radius: 8px; background: #071221; color: #7187a7; font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }
.zhihu-browser-input input { min-width: 260px; height: 36px; flex: 1; }
.zhihu-login-screen {
  min-width: 0;
  min-height: 0;
  display: grid;
  place-items: center;
  overflow: auto;
  border: 1px solid #203958;
  border-radius: 13px;
  background: #07101f;
}
.zhihu-login-screen img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center top;
}
.zhihu-login-screen img.interactive { cursor: crosshair; user-select: none; }
.zhihu-login-screen img.busy { cursor: wait; opacity: .72; }
.login-screen-loading { color: #7f93b0; font-size: .86rem; }
.zhihu-login-dialog > .field-help { margin: 13px 2px; line-height: 1.6; }
.article-actions { flex-wrap: wrap; justify-content: flex-end; }
.article-actions .article-publish { padding: 0 12px; }
.article-actions .article-view { display: inline-flex; align-items: center; }

@media (max-width: 1100px) {
  .account-row { grid-template-columns: minmax(150px, 1.2fr) 105px 105px 90px 50px; }
  .account-row .row-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .account-row.header span:last-child { display: none; }
}

@media (max-width: 820px) {
  .account-row { grid-template-columns: 1fr 1fr; }
  .account-row .login-status, .account-row .switch { justify-self: start; }
  #zhihu-login-dialog { padding: 8px; }
  #zhihu-login-dialog .zhihu-login-dialog {
    width: calc(100vw - 16px) !important;
    height: calc(100vh - 16px);
    height: calc(100dvh - 16px);
    max-height: calc(100vh - 16px);
    max-height: calc(100dvh - 16px);
    padding: 16px;
    grid-template-rows: auto auto minmax(220px, 1fr) auto auto;
  }
  #zhihu-login-dialog[data-mode="website"] .zhihu-login-dialog { grid-template-rows: auto auto auto minmax(220px, 1fr) auto auto; }
  .zhihu-login-status { align-items: flex-start; flex-direction: column; gap: 7px; }
  .zhihu-login-dialog .dialog-actions { flex-wrap: wrap; }
  .zhihu-browser-input input { min-width: 100%; }
}

@media (max-width: 520px) {
  .account-row .login-status, .account-row .switch { width: auto; }
}