/* Shared visual alignment; retain native controls, table scrolling and mobile scrollers. */
body .content-inner .page-header {
  margin: 0 0 20px;
  border: 1px solid var(--nn-line);
  border-radius: var(--nn-radius);
}
body .content-inner .header-content { gap: 16px; }
body .content-inner .header-actions { min-width: 0; }
/* Long bot labels must stay inside their column instead of covering dates. */
body .arco-table-cell .arco-tag {
  box-sizing: border-box;
  max-width: 100%;
  height: auto;
  min-height: 20px;
  white-space: normal;
  overflow-wrap: anywhere;
}
body .arco-table-cell .arco-tag .arco-tag-icon { flex-shrink: 0; }
/* Matched desktop cards. Footer is outside the card alignment, not part of its height. */
@media (min-width: 1024px) {
  body .login-page.nn-login-ready {
    grid-template-columns: minmax(0, 480px) minmax(0, 440px);
    align-items: stretch;
    gap: clamp(24px, 3vw, 48px);
    padding: 48px 32px 88px;
  }
  body .nn-login-ready .nn-login-story {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    padding: 36px 40px;
    border-radius: 20px;
  }
  body .nn-login-ready .nn-login-orbit {
    flex: 1 0 260px;
    min-height: 260px;
    margin: 20px auto;
  }
  body .nn-login-ready .nn-story-title { font-size: clamp(30px, 2.6vw, 38px); line-height: 1.5; }
  body .nn-login-ready .nn-story-chips { margin-top: 24px; }
  body .nn-login-ready .login-container {
    position: relative;
    display: flex;
    flex-direction: column;
    max-width: none;
  }
  body .nn-login-ready .login-card { flex: 1 0 auto; box-sizing: border-box; }
  body .nn-login-ready .login-card > .arco-card-body { padding: 32px; }
  body .nn-login-ready .login-header { margin-bottom: 20px; }
  body .nn-login-ready .login-logo { height: 34px; }
  body .nn-login-ready .login-title { margin-top: 14px; }
  body .nn-login-ready .api-status { margin-bottom: 18px; }
  body .nn-login-ready .login-footer {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin-top: 18px;
    font-size: 12px;
    text-align: center;
  }
}
@media (max-width: 640px) {
  body .content-inner .page-header { margin-bottom: 16px; }
  body .content-inner .header-content { gap: 12px; }
}
/* Extension screens use the same page gutters, surfaces and controls as the app. */
body .content-inner :is(.tpolicy-page, .tcl-page) { padding: 0; width: 100%; max-width: none; }
body .content-inner :is(.tpolicy-header, .tcl-header) { padding: 16px 20px; margin-bottom: 20px; }
body .content-inner :is(.tpolicy-header, .tpolicy-card, .tcl-header, .tcl-stat, .tcl-filters, .tcl-list, .tcl-card) {
  border: 1px solid var(--nn-line);
  border-radius: var(--nn-radius);
  background: var(--color-bg-2);
  box-shadow: var(--nn-shadow);
}
body .tgm-page .tcl-card { padding: 16px; }
body .content-inner :is(.tpolicy-header, .tcl-header) h1 { font-size: 20px; line-height: 1.4; overflow-wrap: anywhere; }
body .content-inner :is(.tpolicy-page textarea, .tcl-page input, .tcl-page select) { border-radius: 7px; }
body .tcl-table-wrap { border-radius: inherit; }
body .tcl-dialog { border-radius: 14px; }
@media (max-width: 640px) {
  body .content-inner :is(.tpolicy-header, .tcl-header) { padding: 12px 16px; margin-bottom: 16px; }
  body .content-inner :is(.tpolicy-header, .tcl-header) h1 { font-size: 19px; }
}
@media (min-width: 901px) {
  /* Reserve two lines of help so the paired keyword editors begin on one baseline. */
  body .tpolicy-grid > .tpolicy-card { display: flex; flex-direction: column; }
  body .tpolicy-grid .tpolicy-help { min-height: 3.4em; }
  body .tpolicy-grid textarea { flex: 1 0 auto; }
}