.trial-banner { position: fixed; inset: 0 0 auto; z-index: 180; min-height: 40px;
  padding: 9px 14px; background: #fff0c4; color: #563d0b; border-bottom: 1px solid #d9b967;
  text-align: center; font-size: 13px; font-weight: 600; line-height: 22px; }
body.has-trial-banner { --trial-bar-h: 40px; padding-top: var(--trial-bar-h); }
body.has-trial-banner.shell.web #view-main > .topbar { top: var(--trial-bar-h); }
body.has-trial-banner .co-trial { scroll-margin-top: 100px; }
.co-trial { padding: 16px; border-top: 1px solid var(--line); }
.co-trial p { margin: 6px 0; }
.co-trial .rowtools { justify-content: flex-start; flex-wrap: wrap; margin: 10px 0; }
.co-trial input { width: 105px; min-width: 0; }
.co-trial label { margin: 0; }
@media (max-width: 599px) {
  .trial-banner { font-size: 12px; padding: 7px 12px; }
  body.has-trial-banner { --trial-bar-h: 58px; }
}

.co-trial .rowtools button { min-height: 36px; padding: 8px 12px; }
body.shell #panes .co-trial .rowtools { justify-content: flex-start; }
body.shell #panes .co-trial .rowtools button.more {
  min-height: 36px; width: auto; padding: 8px 12px; border: 1px solid var(--line);
  border-radius: 6px; background: var(--surface); color: var(--ink);
}
@media (min-width: 900px) {
  body.has-trial-banner.shell.web .side { top: var(--trial-bar-h); height: calc(100dvh - var(--trial-bar-h)); }
}