/**
 * This is the main application stylesheet. It should include or import all
 * stylesheets used throughout the application as this is the only stylesheet in
 * the Grunt configuration that is automatically processed.
 */
/**
 * These are the variables used throughout the application. This is where 
 * overwrites that are not specific to components should be maintained.
 */
/**
 * Typography-related.
 */
/**
 * Dark mode is handled by DarkReader (https://github.com/darkreader/darkreader).
 * Loaded via CDN in index.html; toggled via DarkReader.enable() / DarkReader.disable()
 * in navbar.component.js. This file only contains the toggle button styles.
 */
html:not(.dark),
body:not(.dark) {
  background-color: #fff !important;
  color: inherit !important;
}
.theme-toggle-btn.md-button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 50% !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  cursor: pointer;
  transition: background 150ms ease, border-color 150ms ease;
  color: #64748b;
  line-height: 34px !important;
}
.theme-toggle-btn.md-button:after {
  display: none !important;
}
.theme-toggle-btn.md-button:hover {
  background: rgba(66, 139, 202, 0.08) !important;
  border-color: rgba(66, 139, 202, 0.16) !important;
}
.theme-toggle-btn.md-button md-icon {
  font-size: 20px !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  color: #64748b;
  line-height: 20px !important;
  transition: color 150ms ease;
}
.theme-toggle-btn.md-button:hover md-icon {
  color: #428bca !important;
}
.INVALID_INPUT_ELEM {
  color: #a54243;
  border-color: #a54243;
}
.INVALID_INPUT_ELEM:focus {
  border-color: #a54243;
  box-shadow: none;
  outline: 0 none;
}
.FORM_ERROR_TEXT {
  margin: 0 auto 20px;
  position: relative;
}
.FORM_ERROR_TEXT .error {
  left: 0;
  position: absolute;
  font-size: 12px;
  color: #a54243;
}
.Aligner {
  display: flex;
  align-items: center;
  justify-content: center;
}
.Aligner-item {
  max-width: 50%;
}
.Aligner-item--top {
  align-self: flex-start;
}
.Aligner-item--bottom {
  align-self: flex-end;
}
.btn {
  font-size: 16px;
  position: relative;
  outline: none!important;
  box-shadow: none!important;
}
.btn h1,
.btn h2,
.btn h3,
.btn h4,
.btn h5,
.btn h6 {
  margin: 0px;
}
.btn:hover,
.btn:focus,
.btn:focus.active,
.btn.active,
.btn:active {
  border-color: #428bca !important;
  color: #428bca !important;
  background-color: #fff !important;
}
.btn:hover.btn-danger,
.btn:focus.btn-danger,
.btn:focus.active.btn-danger,
.btn.active.btn-danger,
.btn:active.btn-danger {
  border-color: #933b3c !important;
  color: #FFFFFF !important;
  background-color: #933b3c !important;
}
.btn.btn-primary {
  background-color: #428bca !important;
  color: #FFFFFF !important;
  border: 1px solid #428bca;
}
.btn.btn-primary.active,
.btn.btn-primary:hover {
  color: #FFFFFF !important;
  background-color: #36465d !important;
  border: 1px solid #36465d;
}
.btn.btn-danger {
  background-color: #a54243 !important;
  color: #FFFFFF !important;
  border: 1px solid #a54243;
}
.btn.btn-danger.active,
.btn.btn-danger:hover {
  color: #FFFFFF !important;
  background-color: #933b3c !important;
  border: 1px solid #933b3c;
}
.btn:last-child {
  margin-right: 0px;
}
.btn-default {
  color: #212121;
  background-color: #FFFFFF;
  border-color: #212121;
}
.btn-default:focus,
.btn-default.focus {
  color: #212121;
  background-color: #e6e6e6;
  border-color: #000000;
}
.btn-default:hover {
  color: #212121;
  background-color: #e6e6e6;
  border-color: #020202;
}
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  color: #212121;
  background-color: #e6e6e6;
  border-color: #020202;
}
.btn-default:active:hover,
.btn-default.active:hover,
.open > .dropdown-toggle.btn-default:hover,
.btn-default:active:focus,
.btn-default.active:focus,
.open > .dropdown-toggle.btn-default:focus,
.btn-default:active.focus,
.btn-default.active.focus,
.open > .dropdown-toggle.btn-default.focus {
  color: #212121;
  background-color: #d4d4d4;
  border-color: #000000;
}
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  background-image: none;
}
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled.focus,
.btn-default[disabled].focus,
fieldset[disabled] .btn-default.focus {
  background-color: #FFFFFF;
  border-color: #212121;
}
.btn-default .badge {
  color: #FFFFFF;
  background-color: #212121;
}
.btn-primary {
  color: #428bca;
  background-color: #FFFFFF;
  border-color: #428bca;
}
.btn-primary:focus,
.btn-primary.focus {
  color: #428bca;
  background-color: #e6e6e6;
  border-color: #1f496e;
}
.btn-primary:hover {
  color: #428bca;
  background-color: #e6e6e6;
  border-color: #2d6ca2;
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  color: #428bca;
  background-color: #e6e6e6;
  border-color: #2d6ca2;
}
.btn-primary:active:hover,
.btn-primary.active:hover,
.open > .dropdown-toggle.btn-primary:hover,
.btn-primary:active:focus,
.btn-primary.active:focus,
.open > .dropdown-toggle.btn-primary:focus,
.btn-primary:active.focus,
.btn-primary.active.focus,
.open > .dropdown-toggle.btn-primary.focus {
  color: #428bca;
  background-color: #d4d4d4;
  border-color: #1f496e;
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  background-image: none;
}
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus {
  background-color: #FFFFFF;
  border-color: #428bca;
}
.btn-primary .badge {
  color: #FFFFFF;
  background-color: #428bca;
}
.btn-danger {
  color: #a54243;
  background-color: #FFFFFF;
  border-color: #a54243;
}
.btn-danger:focus,
.btn-danger.focus {
  color: #a54243;
  background-color: #e6e6e6;
  border-color: #4a1e1e;
}
.btn-danger:hover {
  color: #a54243;
  background-color: #e6e6e6;
  border-color: #793131;
}
.btn-danger:active,
.btn-danger.active,
.open > .dropdown-toggle.btn-danger {
  color: #a54243;
  background-color: #e6e6e6;
  border-color: #793131;
}
.btn-danger:active:hover,
.btn-danger.active:hover,
.open > .dropdown-toggle.btn-danger:hover,
.btn-danger:active:focus,
.btn-danger.active:focus,
.open > .dropdown-toggle.btn-danger:focus,
.btn-danger:active.focus,
.btn-danger.active.focus,
.open > .dropdown-toggle.btn-danger.focus {
  color: #a54243;
  background-color: #d4d4d4;
  border-color: #4a1e1e;
}
.btn-danger:active,
.btn-danger.active,
.open > .dropdown-toggle.btn-danger {
  background-image: none;
}
.btn-danger.disabled:hover,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger:hover,
.btn-danger.disabled:focus,
.btn-danger[disabled]:focus,
fieldset[disabled] .btn-danger:focus,
.btn-danger.disabled.focus,
.btn-danger[disabled].focus,
fieldset[disabled] .btn-danger.focus {
  background-color: #FFFFFF;
  border-color: #a54243;
}
.btn-danger .badge {
  color: #FFFFFF;
  background-color: #a54243;
}
.theme-site .md-padding {
  padding: 20px;
}
.theme-site .md-fake-disabled-button {
  display: inline-block;
  position: relative;
  cursor: pointer;
  min-height: 36px;
  min-width: 88px;
  line-height: 36px;
  vertical-align: middle;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  text-align: center;
  border-radius: 2px;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  outline: none;
  border: 0;
  padding: 0 6px;
  margin: 6px 8px;
  background: transparent;
  color: currentColor;
  white-space: nowrap;
  font-weight: 500;
  font-size: 14px;
  font-style: inherit;
  font-variant: inherit;
  font-family: inherit;
  text-decoration: none;
  overflow: hidden;
  -webkit-transition: box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
  transition: box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
  color: #d4d4d4;
}
.theme-site .md-button.checkbox-align {
  /* padding-left: 0px; */
  margin-left: -7px;
}
.theme-site .material-icons.small {
  font-size: 14px;
}
.theme-site .md-button.md-fab.md-mini:not([disabled]) {
  transition: 0.3s;
}
.theme-site .md-button.md-fab.md-mini:not([disabled]).active {
  background-color: #428bca;
}
.theme-site .md-button.md-fab.md-mini:not([disabled]).md-primary {
  background-color: #428bca;
  color: #FFFFFF;
}
.theme-site .md-button.md-fab.md-mini:not([disabled]).md-primary.active {
  background-color: #36465d;
}
.theme-site .md-button.md-primary:not([disabled]):hover {
  background-color: #36465d;
  color: #FFFFFF;
  transition: 0.3s;
}
.theme-site .md-button.md-default-theme.md-accent,
.theme-site .md-button.md-accent {
  background-color: transparent;
  color: #a54243;
}
.theme-site .md-button.md-default-theme,
.theme-site .md-button {
  background-color: transparent;
  color: #428bca;
}
.theme-site a.md-button.md-default-theme.md-accent,
.theme-site a.md-button.md-accent {
  background-color: transparent;
  color: #a54243;
}
.theme-site .md-button {
  font-weight: 400;
  font-size: 16px;
  padding-left: 12px;
  padding-right: 12px;
  border-radius: 8px;
}
.theme-site .md-button.md-icon-button {
  padding-left: 8px;
  padding-right: 8px;
}
.theme-site .md-button.md-primary {
  color: #FFFFFF;
  background-color: #428bca;
}
.theme-site .md-button:disabled {
  opacity: 0.25;
}
.theme-site .disabled {
  color: #d4d4d4;
}
.theme-site a.md-button,
.theme-site .link.md-button {
  background-color: transparent;
  color: #212121;
  text-transform: none;
}
.theme-site a.md-button:hover,
.theme-site .link.md-button:hover {
  color: #428bca;
  background-color: transparent;
}
.theme-site a.md-button.md-primary,
.theme-site .link.md-button.md-primary {
  color: #428bca;
}
.theme-site a.md-button.md-accent,
.theme-site .link.md-button.md-accent {
  background-color: transparent;
  color: #a54243;
}
.theme-site a.md-button.site-button--colored,
.theme-site .link.md-button.site-button--colored {
  background-color: #428bca;
  color: #FFFFFF;
  border-radius: 8px;
  font-weight: 700;
  box-shadow: 0 2px 6px rgba(66, 139, 202, 0.25);
  transition: all 0.2s ease;
}
.theme-site a.md-button.site-button--colored:hover,
.theme-site .link.md-button.site-button--colored:hover {
  background-color: #36465d;
  box-shadow: 0 4px 10px rgba(66, 139, 202, 0.35);
}
.theme-site a.md-button.site-button--colored:active,
.theme-site .link.md-button.site-button--colored:active {
  transform: scale(0.97);
}
.theme-site a.md-button.site-button--colored.active,
.theme-site .link.md-button.site-button--colored.active {
  background-color: #36465d;
}
.theme-site h2.link {
  cursor: pointer;
  cursor: hand;
}
.theme-site .md-button {
  min-width: 36px;
  text-transform: none;
}
.theme-site .md-button.md-default-theme.md-primary,
.theme-site .md-button.md-default-theme.md-primary-raised {
  background-color: #428bca;
  color: #FFFFFF;
}
.theme-site .md-button.md-default-theme.md-primary:not([disabled]):hover,
.theme-site .md-button.md-default-theme.md-primary-raised:not([disabled]):hover {
  background-color: #36465d;
  transition: 0.3s;
}
.theme-site md-tabs.md-default-theme .md-tab.md-active,
.theme-site md-tabs .md-tab.md-active,
.theme-site md-tabs.md-default-theme .md-tab.md-active md-icon,
.theme-site md-tabs .md-tab.md-active md-icon,
.theme-site md-tabs.md-default-theme .md-tab.md-focused,
.theme-site md-tabs .md-tab.md-focused,
.theme-site md-tabs.md-default-theme .md-tab.md-focused md-icon,
.theme-site md-tabs .md-tab.md-focused md-icon {
  color: #428bca;
}
.theme-site md-tabs.md-default-theme md-ink-bar,
.theme-site md-tabs md-ink-bar {
  background: #428bca none repeat scroll 0 0;
  color: #428bca;
}
.theme-site md-input-container.md-default-theme.md-input-focused:not(.md-input-invalid) .md-input,
.theme-site md-input-container.md-input-focused:not(.md-input-invalid) .md-input,
.theme-site md-input-container.md-default-theme.md-input-resized:not(.md-input-invalid) .md-input,
.theme-site md-input-container.md-input-resized:not(.md-input-invalid) .md-input {
  border-color: #428bca;
}
.theme-site md-input-container.md-default-theme.md-input-focused:not(.md-input-invalid) label,
.theme-site md-input-container.md-input-focused:not(.md-input-invalid) label,
.theme-site md-input-container.md-default-theme.md-input-focused:not(.md-input-invalid) md-icon,
.theme-site md-input-container.md-input-focused:not(.md-input-invalid) md-icon {
  color: #428bca;
}
.theme-site md-checkbox.md-default-theme.md-checked .md-icon,
.theme-site md-checkbox.md-checked .md-icon {
  background-color: #428bca;
  color: #FFFFFF;
}
.theme-site md-input-container.md-default-theme.md-input-has-value:not(.md-input-invalid) label,
.theme-site md-input-container.md-input-has-value:not(.md-input-invalid) label {
  color: #428bca;
}
.theme-site .md-text p {
  margin: 0;
}
.theme-site .main-card {
  min-width: 300px;
}
.theme-site md-input-container .md-input-invalid .ng-touched.ng-invalid {
  color: #a54243;
}
.theme-site md-input-container.md-default-theme.md-input-invalid label,
.theme-site md-input-container.md-input-invalid label,
.theme-site md-input-container.md-default-theme.md-input-invalid .md-input-message-animation,
.theme-site md-input-container.md-input-invalid .md-input-message-animation,
.theme-site md-input-container.md-default-theme.md-input-invalid .md-char-counter,
.theme-site md-input-container.md-input-invalid .md-char-counter {
  color: #a54243;
}
.theme-site md-input-container.md-default-theme.md-input-invalid .md-input,
.theme-site md-input-container.md-input-invalid .md-input {
  border-color: #a54243;
}
.theme-site md-input-container.md-input-has-value input {
  color: #428bca !important;
  border-color: #428bca;
}
.theme-site md-input-container.md-input-has-value.md-input-invalid input {
  color: #a54243;
  border-color: #a54243;
}
.theme-site md-input-container.md-input-has-value.md-input-invalid label {
  color: #a54243;
}
.theme-site md-checkbox .md-label > * {
  color: #212121;
}
.theme-site md-tooltip {
  background-color: rgba(0, 0, 0, 0.9);
  color: #FFFFFF;
  padding: 10px;
  text-align: left;
  max-width: calc(100% - 20px);
}
.theme-site md-tooltip .md-content {
  height: auto;
}
.theme-site md-input-container.md-input-focused label:not(.md-no-float),
.theme-site md-input-container.md-input-has-placeholder label:not(.md-no-float),
.theme-site md-input-container.md-input-has-value label:not(.md-no-float) {
  font-weight: 700;
}
.theme-site .ng-messages-fix {
  visibility: hidden !important;
}
.theme-site md-progress-circular {
  z-index: 1;
}
.theme-site md-progress-circular path {
  stroke: #428bca;
}
.theme-site md-progress-circular.md-accent path {
  stroke: #a54243;
}
.theme-site md-card {
  background-color: #FFFFFF;
  border-radius: 8px;
}
.theme-site md-input-container .md-input {
  border-color: #212121;
}
.theme-site .md-dialog-container {
  z-index: 99999;
}
.mdl-textfield__error {
  color: #a54243;
}
.mdl-textfield__error.ng-active {
  visibility: visible;
}
.ng-invalid .mdl-textfield--floating-label.is-focused,
.is-invalid .mdl-textfield--floating-label.is-focused,
.ng-invalid .mdl-textfield--floating-label.is-dirty,
.is-invalid .mdl-textfield--floating-label.is-dirty,
.ng-invalid .mdl-textfield--floating-label,
.is-invalid .mdl-textfield--floating-label {
  color: #a54243;
}
.ng-invalid .mdl-textfield--floating-label.is-focused .mdl-textfield__label,
.is-invalid .mdl-textfield--floating-label.is-focused .mdl-textfield__label,
.ng-invalid .mdl-textfield--floating-label.is-dirty .mdl-textfield__label,
.is-invalid .mdl-textfield--floating-label.is-dirty .mdl-textfield__label,
.ng-invalid .mdl-textfield--floating-label .mdl-textfield__label,
.is-invalid .mdl-textfield--floating-label .mdl-textfield__label {
  color: #a54243;
}
.ng-invalid .mdl-textfield--floating-label.is-focused .mdl-textfield__label::after,
.is-invalid .mdl-textfield--floating-label.is-focused .mdl-textfield__label::after,
.ng-invalid .mdl-textfield--floating-label.is-dirty .mdl-textfield__label::after,
.is-invalid .mdl-textfield--floating-label.is-dirty .mdl-textfield__label::after,
.ng-invalid .mdl-textfield--floating-label .mdl-textfield__label::after,
.is-invalid .mdl-textfield--floating-label .mdl-textfield__label::after {
  background-color: #a54243;
}
.mdl-textfield__input.ng-invalid,
.mdl-textfield__input.is-invalid {
  border-color: #a54243;
}
.ng-valid .mdl-textfield__input,
.ng-pristine .mdl-textfield__input,
.ng-valid + .mdl-textfield__input,
.ng-pristine + .mdl-textfield__input {
  color: #428bca;
}
.ng-valid .mdl-textfield__input.is-untouched,
.ng-pristine .mdl-textfield__input.is-untouched,
.ng-valid + .mdl-textfield__input.is-untouched,
.ng-pristine + .mdl-textfield__input.is-untouched,
.ng-valid .mdl-textfield__input.ng-pristine,
.ng-pristine .mdl-textfield__input.ng-pristine,
.ng-valid + .mdl-textfield__input.ng-pristine,
.ng-pristine + .mdl-textfield__input.ng-pristine {
  border-color: #428bca;
}
.ng-valid .mdl-textfield--floating-label.is-focused .mdl-textfield__label,
.ng-pristine .mdl-textfield--floating-label.is-focused .mdl-textfield__label,
.ng-valid .mdl-textfield--floating-label.is-dirty .mdl-textfield__label,
.ng-pristine .mdl-textfield--floating-label.is-dirty .mdl-textfield__label,
.ng-valid .mdl-textfield--floating-label .mdl-textfield__label,
.ng-pristine .mdl-textfield--floating-label .mdl-textfield__label {
  color: #428bca;
}
.ng-valid .mdl-textfield--floating-label.is-focused .mdl-textfield__label:after,
.ng-pristine .mdl-textfield--floating-label.is-focused .mdl-textfield__label:after,
.ng-valid .mdl-textfield--floating-label.is-dirty .mdl-textfield__label:after,
.ng-pristine .mdl-textfield--floating-label.is-dirty .mdl-textfield__label:after,
.ng-valid .mdl-textfield--floating-label .mdl-textfield__label:after,
.ng-pristine .mdl-textfield--floating-label .mdl-textfield__label:after {
  background-color: #428bca;
}
.ng-valid .mdl-textfield--floating-label.is-focused .mdl-textfield__error,
.ng-pristine .mdl-textfield--floating-label.is-focused .mdl-textfield__error,
.ng-valid .mdl-textfield--floating-label.is-dirty .mdl-textfield__error,
.ng-pristine .mdl-textfield--floating-label.is-dirty .mdl-textfield__error,
.ng-valid .mdl-textfield--floating-label .mdl-textfield__error,
.ng-pristine .mdl-textfield--floating-label .mdl-textfield__error {
  color: #212121;
}
.ng-valid.mdl-textfield__input + .mdl-textfield__label::after,
.ng-valid.mdl-textfield__input + .mdl-textfield__label::after {
  background-color: #428bca !important;
}
.ng-valid.mdl-textfield__input.is-focused,
.ng-valid.mdl-textfield__input.is-focused,
.ng-valid.mdl-textfield__input + .mdl-textfield__label.is-focused,
.ng-valid.mdl-textfield__input + .mdl-textfield__label.is-focused,
.ng-valid.mdl-textfield__input.is-dirty,
.ng-valid.mdl-textfield__input.is-dirty,
.ng-valid.mdl-textfield__input + .mdl-textfield__label.is-dirty,
.ng-valid.mdl-textfield__input + .mdl-textfield__label.is-dirty,
.ng-valid.mdl-textfield__input,
.ng-valid.mdl-textfield__input,
.ng-valid.mdl-textfield__input + .mdl-textfield__label,
.ng-valid.mdl-textfield__input + .mdl-textfield__label {
  color: #428bca !important;
}
.ng-valid.mdl-textfield__input + .mdl-textfield__error,
.ng-valid.mdl-textfield__input + .mdl-textfield__error,
.ng-valid.mdl-textfield__input + .mdl-textfield__label + .mdl-textfield__error,
.ng-valid.mdl-textfield__input + .mdl-textfield__label + .mdl-textfield__error {
  color: #212121;
}
.mdl-button[disabled]:hover,
.mdl-button.mdl-button--disabled:hover {
  background-color: transparent;
}
.theme-site md-card md-card-header md-card-header-text {
  overflow: hidden;
  text-overflow: ellipsis;
}
.theme-site md-card md-card-content {
  padding: 0;
  margin: 16px;
}
md-card.dragover {
  background-color: rgba(66, 139, 202, 0.05);
}
md-input-container.disabled md-icon {
  color: #d4d4d4;
}
.mdl-spinner__layer-1,
.mdl-spinner__layer-2 {
  border-color: #428bca;
}
.mdl-spinner__layer-3,
.mdl-spinner__layer-4 {
  border-color: #a54243;
}
.mdl-tabs__panel {
  max-height: 500px;
  overflow: scroll;
  transform: translate3d(0px, 0px, 0px);
  transition: transform 0.5s cubic-bezier(0.35, 0, 0.25, 1) 0s, -webkit-transform 0.5s cubic-bezier(0.35, 0, 0.25, 1) 0s;
}
.theme-site .md-subheader,
.theme-site .md-title {
  font-weight: 500;
}
.theme-site md-card md-card-title md-card-title-text .md-subhead {
  font-size: 16px;
}
.theme-site md-card md-card-header md-card-header-text .md-subhead {
  font-size: 16px;
}
.theme-site md-input-container .md-char-counter,
.theme-site md-input-container .md-input-message-animation {
  font-size: 14px;
}
.theme-site .md-subheader {
  font-size: 16px;
}
.theme-site .md-body-1 {
  font-size: 16px;
}
.theme-site md-dialog {
  background-color: #FFFFFF;
  z-index: 9999999999999999 !important;
  border-radius: 8px;
  overflow: hidden;
}
.theme-site .md-panel-outer-wrapper {
  z-index: 9999999999999999 !important;
}
.theme-site md-backdrop.md-opaque {
  background-color: #000;
}
.theme-site md-dialog md-toolbar {
  background-color: #36465d !important;
  min-height: 56px;
}
.theme-site md-dialog md-toolbar .md-toolbar-tools {
  border-bottom: none;
  color: #FFFFFF;
}
.theme-site md-dialog md-toolbar .md-toolbar-tools h1,
.theme-site md-dialog md-toolbar .md-toolbar-tools h2,
.theme-site md-dialog md-toolbar .md-toolbar-tools h3,
.theme-site md-dialog md-toolbar .md-toolbar-tools h4 {
  color: #FFFFFF;
  font-weight: 500;
  font-size: 18px;
  margin: 0;
}
.theme-site md-dialog md-toolbar .md-toolbar-tools md-icon {
  color: #FFFFFF;
}
.theme-site md-dialog md-toolbar .md-toolbar-tools .md-icon-button {
  color: rgba(255, 255, 255, 0.9);
}
.theme-site md-dialog md-toolbar .md-toolbar-tools .md-icon-button:hover {
  background-color: rgba(255, 255, 255, 0.1);
}
.theme-site md-dialog .md-actions,
.theme-site md-dialog md-dialog-actions {
  border-top: 1px solid #e5e7eb;
  padding: 12px;
  margin: 0;
}
.theme-site md-dialog .md-actions .md-button,
.theme-site md-dialog md-dialog-actions .md-button {
  margin: 8px;
}
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content,
.theme-site md-dialog._md-confirm-dialog-content,
.theme-site md-dialog[aria-label*="Confirm"],
.theme-site md-dialog[aria-label*="Delete"],
.theme-site md-dialog[aria-label*="delete"],
.theme-site md-dialog[aria-label*="public"],
.theme-site md-dialog[aria-label*="Public"],
.theme-site md-dialog[aria-label*="privacy"],
.theme-site md-dialog[aria-label*="Recalculate"] {
  border-radius: 8px;
  max-width: 450px;
}
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content md-dialog-content,
.theme-site md-dialog._md-confirm-dialog-content md-dialog-content,
.theme-site md-dialog[aria-label*="Confirm"] md-dialog-content,
.theme-site md-dialog[aria-label*="Delete"] md-dialog-content,
.theme-site md-dialog[aria-label*="delete"] md-dialog-content,
.theme-site md-dialog[aria-label*="public"] md-dialog-content,
.theme-site md-dialog[aria-label*="Public"] md-dialog-content,
.theme-site md-dialog[aria-label*="privacy"] md-dialog-content,
.theme-site md-dialog[aria-label*="Recalculate"] md-dialog-content {
  display: flex;
  flex-direction: column;
  overflow: visible;
}
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content .md-dialog-content-body,
.theme-site md-dialog._md-confirm-dialog-content .md-dialog-content-body,
.theme-site md-dialog[aria-label*="Confirm"] .md-dialog-content-body,
.theme-site md-dialog[aria-label*="Delete"] .md-dialog-content-body,
.theme-site md-dialog[aria-label*="delete"] .md-dialog-content-body,
.theme-site md-dialog[aria-label*="public"] .md-dialog-content-body,
.theme-site md-dialog[aria-label*="Public"] .md-dialog-content-body,
.theme-site md-dialog[aria-label*="privacy"] .md-dialog-content-body,
.theme-site md-dialog[aria-label*="Recalculate"] .md-dialog-content-body {
  padding: 0;
}
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content .md-title,
.theme-site md-dialog._md-confirm-dialog-content .md-title,
.theme-site md-dialog[aria-label*="Confirm"] .md-title,
.theme-site md-dialog[aria-label*="Delete"] .md-title,
.theme-site md-dialog[aria-label*="delete"] .md-title,
.theme-site md-dialog[aria-label*="public"] .md-title,
.theme-site md-dialog[aria-label*="Public"] .md-title,
.theme-site md-dialog[aria-label*="privacy"] .md-title,
.theme-site md-dialog[aria-label*="Recalculate"] .md-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 17px;
  font-weight: 500;
  color: #212121;
  padding: 0 0 8px 0;
  margin: 0;
}
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content .md-title::before,
.theme-site md-dialog._md-confirm-dialog-content .md-title::before,
.theme-site md-dialog[aria-label*="Confirm"] .md-title::before,
.theme-site md-dialog[aria-label*="Delete"] .md-title::before,
.theme-site md-dialog[aria-label*="delete"] .md-title::before,
.theme-site md-dialog[aria-label*="public"] .md-title::before,
.theme-site md-dialog[aria-label*="Public"] .md-title::before,
.theme-site md-dialog[aria-label*="privacy"] .md-title::before,
.theme-site md-dialog[aria-label*="Recalculate"] .md-title::before {
  content: "help_outline";
  font-family: 'Material Icons';
  font-size: 22px;
  color: #36465d;
}
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Delete"] .md-title::before,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Delete"] .md-title::before,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Delete"] .md-title::before,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Delete"] .md-title::before,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Delete"] .md-title::before,
.theme-site md-dialog[aria-label*="public"][aria-label*="Delete"] .md-title::before,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Delete"] .md-title::before,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Delete"] .md-title::before,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Delete"] .md-title::before,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="delete"] .md-title::before,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="delete"] .md-title::before,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="delete"] .md-title::before,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="delete"] .md-title::before,
.theme-site md-dialog[aria-label*="delete"][aria-label*="delete"] .md-title::before,
.theme-site md-dialog[aria-label*="public"][aria-label*="delete"] .md-title::before,
.theme-site md-dialog[aria-label*="Public"][aria-label*="delete"] .md-title::before,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="delete"] .md-title::before,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="delete"] .md-title::before {
  content: "warning";
  color: #a54243;
}
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content .md-text-content,
.theme-site md-dialog._md-confirm-dialog-content .md-text-content,
.theme-site md-dialog[aria-label*="Confirm"] .md-text-content,
.theme-site md-dialog[aria-label*="Delete"] .md-text-content,
.theme-site md-dialog[aria-label*="delete"] .md-text-content,
.theme-site md-dialog[aria-label*="public"] .md-text-content,
.theme-site md-dialog[aria-label*="Public"] .md-text-content,
.theme-site md-dialog[aria-label*="privacy"] .md-text-content,
.theme-site md-dialog[aria-label*="Recalculate"] .md-text-content {
  color: #64748b;
  font-size: 14px;
  line-height: 1.5;
  padding: 0;
  margin: 0;
}
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content .md-actions,
.theme-site md-dialog._md-confirm-dialog-content .md-actions,
.theme-site md-dialog[aria-label*="Confirm"] .md-actions,
.theme-site md-dialog[aria-label*="Delete"] .md-actions,
.theme-site md-dialog[aria-label*="delete"] .md-actions,
.theme-site md-dialog[aria-label*="public"] .md-actions,
.theme-site md-dialog[aria-label*="Public"] .md-actions,
.theme-site md-dialog[aria-label*="privacy"] .md-actions,
.theme-site md-dialog[aria-label*="Recalculate"] .md-actions,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content md-dialog-actions,
.theme-site md-dialog._md-confirm-dialog-content md-dialog-actions,
.theme-site md-dialog[aria-label*="Confirm"] md-dialog-actions,
.theme-site md-dialog[aria-label*="Delete"] md-dialog-actions,
.theme-site md-dialog[aria-label*="delete"] md-dialog-actions,
.theme-site md-dialog[aria-label*="public"] md-dialog-actions,
.theme-site md-dialog[aria-label*="Public"] md-dialog-actions,
.theme-site md-dialog[aria-label*="privacy"] md-dialog-actions,
.theme-site md-dialog[aria-label*="Recalculate"] md-dialog-actions {
  padding: 12px;
}
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content .md-actions .md-cancel-button,
.theme-site md-dialog._md-confirm-dialog-content .md-actions .md-cancel-button,
.theme-site md-dialog[aria-label*="Confirm"] .md-actions .md-cancel-button,
.theme-site md-dialog[aria-label*="Delete"] .md-actions .md-cancel-button,
.theme-site md-dialog[aria-label*="delete"] .md-actions .md-cancel-button,
.theme-site md-dialog[aria-label*="public"] .md-actions .md-cancel-button,
.theme-site md-dialog[aria-label*="Public"] .md-actions .md-cancel-button,
.theme-site md-dialog[aria-label*="privacy"] .md-actions .md-cancel-button,
.theme-site md-dialog[aria-label*="Recalculate"] .md-actions .md-cancel-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content md-dialog-actions .md-cancel-button,
.theme-site md-dialog._md-confirm-dialog-content md-dialog-actions .md-cancel-button,
.theme-site md-dialog[aria-label*="Confirm"] md-dialog-actions .md-cancel-button,
.theme-site md-dialog[aria-label*="Delete"] md-dialog-actions .md-cancel-button,
.theme-site md-dialog[aria-label*="delete"] md-dialog-actions .md-cancel-button,
.theme-site md-dialog[aria-label*="public"] md-dialog-actions .md-cancel-button,
.theme-site md-dialog[aria-label*="Public"] md-dialog-actions .md-cancel-button,
.theme-site md-dialog[aria-label*="privacy"] md-dialog-actions .md-cancel-button,
.theme-site md-dialog[aria-label*="Recalculate"] md-dialog-actions .md-cancel-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content .md-actions .md-button.md-cancel-button,
.theme-site md-dialog._md-confirm-dialog-content .md-actions .md-button.md-cancel-button,
.theme-site md-dialog[aria-label*="Confirm"] .md-actions .md-button.md-cancel-button,
.theme-site md-dialog[aria-label*="Delete"] .md-actions .md-button.md-cancel-button,
.theme-site md-dialog[aria-label*="delete"] .md-actions .md-button.md-cancel-button,
.theme-site md-dialog[aria-label*="public"] .md-actions .md-button.md-cancel-button,
.theme-site md-dialog[aria-label*="Public"] .md-actions .md-button.md-cancel-button,
.theme-site md-dialog[aria-label*="privacy"] .md-actions .md-button.md-cancel-button,
.theme-site md-dialog[aria-label*="Recalculate"] .md-actions .md-button.md-cancel-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content md-dialog-actions .md-button.md-cancel-button,
.theme-site md-dialog._md-confirm-dialog-content md-dialog-actions .md-button.md-cancel-button,
.theme-site md-dialog[aria-label*="Confirm"] md-dialog-actions .md-button.md-cancel-button,
.theme-site md-dialog[aria-label*="Delete"] md-dialog-actions .md-button.md-cancel-button,
.theme-site md-dialog[aria-label*="delete"] md-dialog-actions .md-button.md-cancel-button,
.theme-site md-dialog[aria-label*="public"] md-dialog-actions .md-button.md-cancel-button,
.theme-site md-dialog[aria-label*="Public"] md-dialog-actions .md-button.md-cancel-button,
.theme-site md-dialog[aria-label*="privacy"] md-dialog-actions .md-button.md-cancel-button,
.theme-site md-dialog[aria-label*="Recalculate"] md-dialog-actions .md-button.md-cancel-button {
  color: #212121 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content .md-actions .md-cancel-button:hover,
.theme-site md-dialog._md-confirm-dialog-content .md-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Confirm"] .md-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Delete"] .md-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label*="delete"] .md-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label*="public"] .md-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Public"] .md-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label*="privacy"] .md-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"] .md-actions .md-cancel-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content md-dialog-actions .md-cancel-button:hover,
.theme-site md-dialog._md-confirm-dialog-content md-dialog-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Confirm"] md-dialog-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Delete"] md-dialog-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label*="delete"] md-dialog-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label*="public"] md-dialog-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Public"] md-dialog-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label*="privacy"] md-dialog-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"] md-dialog-actions .md-cancel-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content .md-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog._md-confirm-dialog-content .md-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Confirm"] .md-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Delete"] .md-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label*="delete"] .md-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label*="public"] .md-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Public"] .md-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label*="privacy"] .md-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"] .md-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content md-dialog-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog._md-confirm-dialog-content md-dialog-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Confirm"] md-dialog-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Delete"] md-dialog-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label*="delete"] md-dialog-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label*="public"] md-dialog-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Public"] md-dialog-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label*="privacy"] md-dialog-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"] md-dialog-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content .md-actions .md-cancel-button:focus,
.theme-site md-dialog._md-confirm-dialog-content .md-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Confirm"] .md-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Delete"] .md-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label*="delete"] .md-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label*="public"] .md-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Public"] .md-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label*="privacy"] .md-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Recalculate"] .md-actions .md-cancel-button:focus,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content md-dialog-actions .md-cancel-button:focus,
.theme-site md-dialog._md-confirm-dialog-content md-dialog-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Confirm"] md-dialog-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Delete"] md-dialog-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label*="delete"] md-dialog-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label*="public"] md-dialog-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Public"] md-dialog-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label*="privacy"] md-dialog-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Recalculate"] md-dialog-actions .md-cancel-button:focus,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content .md-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog._md-confirm-dialog-content .md-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Confirm"] .md-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Delete"] .md-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog[aria-label*="delete"] .md-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog[aria-label*="public"] .md-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Public"] .md-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog[aria-label*="privacy"] .md-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Recalculate"] .md-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content md-dialog-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog._md-confirm-dialog-content md-dialog-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Confirm"] md-dialog-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Delete"] md-dialog-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog[aria-label*="delete"] md-dialog-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog[aria-label*="public"] md-dialog-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Public"] md-dialog-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog[aria-label*="privacy"] md-dialog-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog[aria-label*="Recalculate"] md-dialog-actions .md-button.md-cancel-button:focus {
  background: rgba(0, 0, 0, 0.05) !important;
}
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content .md-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"] .md-actions .md-confirm-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content md-dialog-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"] md-dialog-actions .md-confirm-button {
  text-transform: none;
  font-weight: 500;
}
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Delete"] .md-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"][aria-label*="Delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Delete"] .md-actions .md-confirm-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="delete"] .md-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"][aria-label*="delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"][aria-label*="delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"][aria-label*="delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="delete"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="delete"] .md-actions .md-confirm-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"][aria-label*="Delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"][aria-label*="delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"][aria-label*="delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"][aria-label*="delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="delete"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="delete"] md-dialog-actions .md-confirm-button {
  background-color: #a54243 !important;
  color: #FFFFFF !important;
}
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="public"][aria-label*="Delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="delete"][aria-label*="delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="public"][aria-label*="delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Public"][aria-label*="delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="delete"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="public"][aria-label*="Delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="delete"][aria-label*="delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="public"][aria-label*="delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Public"][aria-label*="delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="delete"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="delete"] md-dialog-actions .md-confirm-button:hover {
  background-color: #933b3c !important;
}
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="public"] .md-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"][aria-label*="public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"][aria-label*="public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"][aria-label*="public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="public"] .md-actions .md-confirm-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Public"] .md-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"][aria-label*="Public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Public"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Public"] .md-actions .md-confirm-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="privacy"] .md-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="privacy"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="privacy"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="privacy"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"][aria-label*="privacy"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"][aria-label*="privacy"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"][aria-label*="privacy"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="privacy"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="privacy"] .md-actions .md-confirm-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Recalculate"] .md-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Recalculate"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Recalculate"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Recalculate"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Recalculate"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"][aria-label*="Recalculate"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Recalculate"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Recalculate"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Recalculate"] .md-actions .md-confirm-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"][aria-label*="public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"][aria-label*="public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"][aria-label*="public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"][aria-label*="Public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Public"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="privacy"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="privacy"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="privacy"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="privacy"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"][aria-label*="privacy"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"][aria-label*="privacy"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"][aria-label*="privacy"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="privacy"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="privacy"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Recalculate"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Recalculate"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Recalculate"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Recalculate"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Recalculate"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="public"][aria-label*="Recalculate"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Recalculate"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Recalculate"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Recalculate"] md-dialog-actions .md-confirm-button {
  background-color: #428bca !important;
  color: #FFFFFF !important;
}
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="delete"][aria-label*="public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="public"][aria-label*="public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Public"][aria-label*="public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="public"][aria-label*="Public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Public"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="privacy"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="privacy"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="privacy"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="privacy"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="delete"][aria-label*="privacy"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="public"][aria-label*="privacy"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Public"][aria-label*="privacy"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="privacy"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="privacy"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button:hover,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="public"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) .md-actions .md-confirm-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Recalculate"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Recalculate"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Recalculate"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Recalculate"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Recalculate"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="public"][aria-label*="Recalculate"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Recalculate"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Recalculate"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Recalculate"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="delete"][aria-label*="public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="public"][aria-label*="public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Public"][aria-label*="public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="public"][aria-label*="Public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Public"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="privacy"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="privacy"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="privacy"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="privacy"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="delete"][aria-label*="privacy"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="public"][aria-label*="privacy"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Public"][aria-label*="privacy"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="privacy"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="privacy"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="public"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Confirm"]:not([aria-label*="Delete"]):not([aria-label*="delete"]) md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog.md-default-theme._md-confirm-dialog-content[aria-label*="Recalculate"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog._md-confirm-dialog-content[aria-label*="Recalculate"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Confirm"][aria-label*="Recalculate"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Delete"][aria-label*="Recalculate"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="delete"][aria-label*="Recalculate"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="public"][aria-label*="Recalculate"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Public"][aria-label*="Recalculate"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="privacy"][aria-label*="Recalculate"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label*="Recalculate"][aria-label*="Recalculate"] md-dialog-actions .md-confirm-button:hover {
  background-color: #357ebd !important;
}
.theme-site md-dialog[aria-label="Confirm plan change"] {
  max-width: 420px !important;
  border-radius: 8px !important;
}
.theme-site md-dialog[aria-label="Confirm plan change"] md-dialog-content {
  padding: 20px 24px 16px !important;
}
.theme-site md-dialog[aria-label="Confirm plan change"] .md-title {
  font-size: 15px !important;
  font-weight: 500 !important;
  color: #212121 !important;
  padding: 0 0 6px 0 !important;
}
.theme-site md-dialog[aria-label="Confirm plan change"] .md-title::before {
  content: "help_outline" !important;
  font-family: 'Material Icons' !important;
  font-size: 20px !important;
  color: #36465d !important;
}
.theme-site md-dialog[aria-label="Confirm plan change"] .md-text-content {
  font-size: 13px !important;
  line-height: 1.5 !important;
  color: #64748b !important;
}
.theme-site md-dialog[aria-label="Confirm plan change"] .md-actions,
.theme-site md-dialog[aria-label="Confirm plan change"] md-dialog-actions {
  padding: 12px 24px 20px !important;
}
.theme-site md-dialog[aria-label="Confirm plan change"] .md-actions .md-cancel-button,
.theme-site md-dialog[aria-label="Confirm plan change"] md-dialog-actions .md-cancel-button,
.theme-site md-dialog[aria-label="Confirm plan change"] .md-actions .md-button.md-cancel-button,
.theme-site md-dialog[aria-label="Confirm plan change"] md-dialog-actions .md-button.md-cancel-button {
  color: #212121 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}
.theme-site md-dialog[aria-label="Confirm plan change"] .md-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label="Confirm plan change"] md-dialog-actions .md-cancel-button:hover,
.theme-site md-dialog[aria-label="Confirm plan change"] .md-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label="Confirm plan change"] md-dialog-actions .md-button.md-cancel-button:hover,
.theme-site md-dialog[aria-label="Confirm plan change"] .md-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label="Confirm plan change"] md-dialog-actions .md-cancel-button:focus,
.theme-site md-dialog[aria-label="Confirm plan change"] .md-actions .md-button.md-cancel-button:focus,
.theme-site md-dialog[aria-label="Confirm plan change"] md-dialog-actions .md-button.md-cancel-button:focus {
  background: rgba(0, 0, 0, 0.05) !important;
}
.theme-site md-dialog[aria-label="Confirm plan change"] .md-actions .md-confirm-button,
.theme-site md-dialog[aria-label="Confirm plan change"] md-dialog-actions .md-confirm-button,
.theme-site md-dialog[aria-label="Confirm plan change"] .md-actions .md-button.md-confirm-button,
.theme-site md-dialog[aria-label="Confirm plan change"] md-dialog-actions .md-button.md-confirm-button {
  background-color: #428bca !important;
  color: #FFFFFF !important;
}
.theme-site md-dialog[aria-label="Confirm plan change"] .md-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label="Confirm plan change"] md-dialog-actions .md-confirm-button:hover,
.theme-site md-dialog[aria-label="Confirm plan change"] .md-actions .md-button.md-confirm-button:hover,
.theme-site md-dialog[aria-label="Confirm plan change"] md-dialog-actions .md-button.md-confirm-button:hover,
.theme-site md-dialog[aria-label="Confirm plan change"] .md-actions .md-confirm-button:focus,
.theme-site md-dialog[aria-label="Confirm plan change"] md-dialog-actions .md-confirm-button:focus,
.theme-site md-dialog[aria-label="Confirm plan change"] .md-actions .md-button.md-confirm-button:focus,
.theme-site md-dialog[aria-label="Confirm plan change"] md-dialog-actions .md-button.md-confirm-button:focus {
  background-color: #357ebd !important;
}
.theme-site md-dialog[aria-label="Error"] .md-title::before,
.theme-site md-dialog[aria-label="error"] .md-title::before {
  content: "error";
  color: #a54243;
}
.theme-site md-dialog md-dialog-actions .md-button,
.theme-site md-dialog .md-actions .md-button {
  text-transform: none;
  font-weight: 500;
  border-radius: 6px;
}
.theme-site md-dialog md-dialog-actions .md-button:not(.md-primary):not(.md-warn):not(.md-accent):not(.md-raised),
.theme-site md-dialog .md-actions .md-button:not(.md-primary):not(.md-warn):not(.md-accent):not(.md-raised) {
  color: #64748b;
}
.theme-site md-dialog md-dialog-actions .md-button.md-raised.md-primary,
.theme-site md-dialog .md-actions .md-button.md-raised.md-primary {
  text-transform: none;
  font-weight: 500;
}
.theme-site md-dialog md-dialog-actions .md-button.md-raised.md-warn,
.theme-site md-dialog .md-actions .md-button.md-raised.md-warn {
  text-transform: none;
  font-weight: 500;
}
.theme-site .md-open-menu-container md-menu-divider {
  background: #d4d4d4;
}
.theme-site md-tooltip {
  height: auto !important;
}
.theme-site md-backdrop.md-dialog-backdrop {
  z-index: 9999;
}
.theme-site md-dialog > *:first-child {
  box-direction: normal;
  box-orient: vertical;
  display: flex;
  flex-direction: column;
  overflow: auto;
}
.theme-site md-dialog {
  border-radius: 8px;
}
.theme-site md-dialog > md-card {
  box-shadow: none;
  margin: 0px;
}
.theme-site md-dialog .md-dialog-content {
  padding: 20px;
}
.theme-site md-fab-speed-dial {
  outline: none;
}
.theme-site .hint {
  bottom: 7px;
  color: #333;
  font-size: 12px;
  left: 2px;
  line-height: 14px;
  position: absolute;
  right: auto;
  transition: all 0.3s cubic-bezier(0.55, 0, 0.55, 0.2);
}
.theme-site .hint.ng-hide,
.theme-site .hint.ng-enter,
.theme-site .hint.ng-leave.ng-leave-active {
  bottom: 26px;
  opacity: 0;
}
.theme-site .hint.ng-leave,
.theme-site .hint.ng-enter.ng-enter-active {
  bottom: 7px;
  opacity: 1;
}
.theme-site .hint-2line br {
  display: none;
}
.theme-site .hidden {
  display: none;
}
.theme-site .center {
  align-self: center;
}
.theme-site .md-padding-left {
  padding-left: 20px;
}
.theme-site .md-virtual-repeat-container.md-autocomplete-suggestions-container,
.theme-site .autocomplete-custom-template {
  background: #FFFFFF;
}
.theme-site .autocomplete-custom-template li {
  border-bottom: 1px solid #d4d4d4;
  height: auto;
  padding-top: 8px;
  padding-bottom: 8px;
  white-space: normal;
}
.theme-site .autocomplete-custom-template li:last-child {
  border-bottom-width: 0;
}
.theme-site .autocomplete-custom-template .item-title,
.theme-site .autocomplete-custom-template .item-metadata {
  display: block;
  line-height: 2;
}
.theme-site .autocomplete-custom-template .item-title md-icon {
  height: 18px;
  width: 18px;
}
.theme-site md-option * {
  max-width: inherit;
  overflow: hidden;
  text-overflow: ellipsis;
}
.theme-site md-option,
.theme-site .autocomplete-custom-template {
  background: #FFFFFF;
  height: auto;
  min-height: 48px;
  padding: 10px;
  line-height: 2;
}
.theme-site md-option .detail,
.theme-site .autocomplete-custom-template .detail {
  padding-left: 8px;
}
.theme-site md-option + md-option {
  border-top: 1px solid #d4d4d4;
}
.theme-site .italic {
  font-style: italic;
}
.theme-site .md-select-menu-container {
  max-width: 600px;
}
.theme-site .middle-card-content {
  margin: 0px 0px 20px 0px;
  padding: 16px 36px 16px 36px;
  border-bottom: 1px solid #d4d4d4;
  border-top: 1px solid #d4d4d4;
}
@media all and (max-width: 600px) {
  .theme-site .md-select-menu-container,
  .theme-site md-select-menu {
    max-width: 98%;
  }
}
@media all and (max-width: 480px) {
  .theme-site .hint-2line {
    bottom: -7px;
  }
  .theme-site .hint-2line br {
    display: block;
  }
}
md-tabs.md-default-theme.md-accent > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item.md-active:not([disabled]),
md-tabs.md-accent > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item.md-active:not([disabled]),
md-tabs.md-default-theme.md-accent > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item.md-active:not([disabled]) md-icon,
md-tabs.md-accent > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item.md-active:not([disabled]) md-icon,
md-tabs.md-default-theme.md-accent > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item.md-focused:not([disabled]),
md-tabs.md-accent > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item.md-focused:not([disabled]),
md-tabs.md-default-theme.md-accent > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item.md-focused:not([disabled]) md-icon,
md-tabs.md-accent > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item.md-focused:not([disabled]) md-icon {
  color: #666;
}
md-tabs.md-accent.md-active {
  color: #428bca;
}
md-tabs.md-default-theme.md-accent > md-tabs-wrapper,
md-tabs.md-accent > md-tabs-wrapper {
  background-color: #ffffff;
}
md-tab-item.md-active {
  color: #428bca;
}
md-tabs.md-accent md-tabs-wrapper md-tabs-canvas md-pagination-wrapper md-ink-bar {
  color: #428bca;
  /* this changes the colour of the ripple */
  background-color: #428bca;
  /* this changes the colour of the ink bar */
}
.theme-site md-list-item.md-2-line .md-list-item-text p,
.theme-site md-list-item.md-2-line > .md-no-style .md-list-item-text p,
.theme-site md-list-item.md-3-line .md-list-item-text p,
.theme-site md-list-item.md-3-line > .md-no-style .md-list-item-text p {
  font-weight: inherit;
}
.theme-site md-list-item {
  max-width: 100%;
  overflow: hidden;
  color: #212121;
}
.theme-site md-list-item.site-md-1-line {
  min-height: 25px;
}
.theme-site md-list-item.site-md-1-line:before {
  min-height: 25px;
}
.theme-site md-list-item .md-list-item-inner {
  color: #212121;
}
.theme-site md-list {
  background-color: transparent;
}
.theme-site .md-subheader {
  background: #FFFFFF;
}
.theme-site .md-dense .md-list-item-text h3 {
  font-size: 1rem;
}
/* Progress Bar */
.material-progress {
  position: relative;
  height: 4px;
  display: block;
  width: 100%;
  background-color: #FFFFFF;
  border-radius: 2px;
  background-clip: padding-box;
  margin: 0.5rem 0 1rem 0;
  overflow: hidden;
}
.material-progress .determinate {
  position: absolute;
  background-color: inherit;
  top: 0;
  bottom: 0;
  background-color: #428bca;
  transition: width 0.3s linear;
}
.material-progress .indeterminate {
  background-color: #428bca;
}
.material-progress .indeterminate:before {
  content: '';
  position: absolute;
  background-color: inherit;
  top: 0;
  left: 0;
  bottom: 0;
  will-change: left, right;
  -webkit-animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
  animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
}
.material-progress .indeterminate:after {
  content: '';
  position: absolute;
  background-color: inherit;
  top: 0;
  left: 0;
  bottom: 0;
  will-change: left, right;
  -webkit-animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
  animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
  -webkit-animation-delay: 1.15s;
  animation-delay: 1.15s;
}
@-webkit-keyframes indeterminate {
  0% {
    left: -35%;
    right: 100%;
  }
  60% {
    left: 100%;
    right: -90%;
  }
  100% {
    left: 100%;
    right: -90%;
  }
}
@keyframes indeterminate {
  0% {
    left: -35%;
    right: 100%;
  }
  60% {
    left: 100%;
    right: -90%;
  }
  100% {
    left: 100%;
    right: -90%;
  }
}
@-webkit-keyframes indeterminate-short {
  0% {
    left: -200%;
    right: 100%;
  }
  60% {
    left: 107%;
    right: -8%;
  }
  100% {
    left: 107%;
    right: -8%;
  }
}
@keyframes indeterminate-short {
  0% {
    left: -200%;
    right: 100%;
  }
  60% {
    left: 107%;
    right: -8%;
  }
  100% {
    left: 107%;
    right: -8%;
  }
}
.chosen-container .chosen-results {
  padding: 0px;
  margin: 0px;
}
.chosen-container-single .chosen-drop,
.chosen-container .chosen-drop {
  border-radius: 0 0 4px 4px;
  overflow: hidden;
}
.chosen-container .chosen-results li,
.chosen-container .chosen-results li.active-result {
  -moz-user-select: none;
  background-color: transparent;
  border: medium none;
  color: #212121;
  cursor: pointer;
  display: block;
  font-size: 14px;
  font-weight: 300;
  height: 48px;
  letter-spacing: 0;
  line-height: 48px;
  margin: 0;
  opacity: 1;
  outline-color: #bdbdbd;
  overflow: hidden;
  padding: 0 16px;
  position: relative;
  text-decoration: none;
  transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1) 0s;
  white-space: nowrap;
  text-align: left;
}
.chosen-container .chosen-results li.highlighted,
.chosen-container .chosen-results li.active-result.highlighted {
  background-color: transparent;
  background-image: none;
  color: #212121;
}
.chosen-container .chosen-results li:hover,
.chosen-container .chosen-results li.active-result:hover {
  font-weight: initial;
  background-color: #d4d4d4;
}
.chosen-container .chosen-results li.result-selected,
.chosen-container .chosen-results li.active-result.result-selected {
  font-weight: 700;
}
.chosen-container.chosen-container-single .chosen-single div {
  align-self: flex-start;
  color: #212121;
  display: table;
  flex-flow: column nowrap;
  height: 100%;
  position: absolute;
  right: 0px;
  text-align: center;
  vertical-align: top;
  width: 26px;
}
.chosen-container-single .chosen-single span {
  text-align: left;
}
.chosen-container-single .chosen-single abbr {
  width: 18px;
  top: 11px;
  /* left: 0; */
}
b,
strong {
  font-weight: 500 !important;
}
.primary {
  color: #428bca;
}
.accent {
  color: #a54243;
}
a:active {
  outline: none;
}
.error {
  color: #a54243;
}
html {
  -webkit-text-size-adjust: 100%;
}
html {
  font-family: "Raleway";
  font-weight: 400;
  color: #212121;
  font-size: 16px;
}
html * {
  font-family: "Raleway";
}
space {
  margin-left: 5px;
}
main {
  position: relative;
}
select {
  -webkit-appearance: none;
  color: #212121;
}
input {
  -webkit-appearance: none;
  -webkit-border-radius: 0;
  font-size: 1rem;
}
* {
  font-weight: 400;
}
html.md-default-theme,
html,
body.md-default-theme,
body {
  background-color: #fff;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  color: #212121;
  font-weight: 400;
}
h1 {
  font-size: 56px;
  font-weight: 100;
}
h2 {
  font-size: 45px;
}
h3 {
  font-size: 34px;
}
h4 {
  font-size: 24px;
}
h5 {
  font-size: 20px;
}
h6 {
  font-size: 18px;
}
a {
  text-decoration: none !important;
  cursor: pointer;
  cursor: hand;
  color: #428bca;
}
.site-sibling-margin + .site-sibling-margin {
  margin-top: 10px;
}
.help-block {
  margin-top: 20px;
  margin-bottom: 20px;
  color: #212121;
}
.transparent {
  opacity: 0;
}
.result-button {
  display: inline-block;
  margin-right: 10px;
}
.result-button:last-child {
  margin-right: 0px;
}
.chosen-container,
.chosen-container * {
  z-index: 999 !important;
}
input {
  border-bottom: 1px solid #212121;
}
.hero {
  min-height: calc(100vh - 163px);
  display: flex;
  position: relative;
}
.hero.top {
  justify-content: flex-start;
}
.hero .hero-center,
.hero.hero-center {
  margin: 0 auto;
  align-items: center;
}
.hero .hero-top {
  align-self: center;
  margin-top: 0px;
}
.job-chooser-center-shell {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  min-height: calc(100vh - 163px);
  padding: 8px;
  width: 100%;
}
.job-chooser-center-shell > sq-job-chooser {
  display: block;
}
.hero-vertical {
  align-items: center;
  display: flex;
  flex: 1 1 0;
  flex-flow: column nowrap;
  width: 100%;
}
.hero-horizontal {
  display: flex;
  flex: 1 1 0;
  justify-content: center;
  width: 100%;
}
.inline-block {
  display: inline-block;
}
.header-buttons {
  float: right;
}
/**
 * Typography
 */
/*
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto Regular'), local('Roboto-Regular'), url(fonts/Roboto-Regular.woff) format('woff');
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto Regular'), local('Roboto-Regular'), url(fonts/Roboto-Regular.woff) format('woff');
}*/
.container-fluid {
  margin: 0 auto;
  max-width: 1800px;
  padding: 0 20px;
}
.page-header {
  margin-top: 60px;
}
.page-header:first-child {
  margin-top: 20px;
}
.btn-primary {
  background-color: #428bca;
  border-color: #428bca;
}
.btn-default {
  border-color: #212121;
  color: #212121;
}
.btn-inverse {
  border: 1px solid #428bca !important;
  border-radius: 3px !important;
  color: #fff !important;
  background-color: #428bca !important;
}
.container .jumbotron {
  padding-top: 52px;
}
.container .jumbotron > .header {
  border-bottom: 3px solid #428bca !important;
  margin-bottom: 15px;
  margin-top: 30px;
  padding-bottom: 30px;
}
/*h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; /*Bitter, sans-serif is a nice font*/
/*}*/
/**App-wide animations
*
**/
/*
.animate-slide{
  -webkit-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s;
  -moz-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s;
  -o-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s;
  transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s;
}*/
/*
.animate-slide {
    -moz-transition: opacity 0.4s ease-in-out;
    -o-transition: opacity 0.4s ease-in-out;
    -webkit-transition: opacity 0.4s ease-in-out;
    transition: opacity 0.4s ease-in-out;
}
*/
/*
.animate-slide.ng-enter
{
  transition: height 1s;
  height: 0px;
  overflow: hidden;
}
.animate-slide.ng-enter.ng-enter-active{
  height:300px;
}
*/
/* 200ms will be applied between each sucessive enter operation */
/*
.animate-slide.second{
  -webkit-transition-delay:1s;
  transition-delay:1s;
}
  

.animate-show {
  opacity:1
}

.animate-show.ng-hide-add.ng-hide-add-active,
.animate-show.ng-hide-remove.ng-hide-remove-active, {
  -webkit-transition:all linear 0.5s;
  transition:all linear 0.5s;
   -webkit-transition-delay:0.2s;
  transition-delay:0.2s;
}

.animate-show.ng-hide {
  line-height:0;
  opacity:0;
  padding:0 0;
}
*/
.animate-slide {
  opacity: 1;
}
.animate-slide.ng-enter {
  opacity: 0;
}
.animate-slide.ng-enter.ng-enter-active {
  opacity: 1;
  transition: 1s linear all;
  -webkit-transition: 1s linear all;
  -moz-transition: 1s linear all;
  -o-transition: 1s linear all;
}
.animate-if.ng-enter,
.animate-if.ng-leave {
  -webkit-transition: all cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.5s;
  transition: all cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.5s;
}
.animate-if.ng-enter,
.animate-if.ng-leave.ng-leave-active {
  opacity: 0;
}
.animate-if.ng-leave,
.animate-if.ng-enter.ng-enter-active {
  opacity: 1;
}
.slide-in-fade-out {
  -webkit-transition: color 0.15s, background-color 0.15s;
  -moz-transition: color 0.15s, background-color 0.15s;
  -ms-transition: color 0.15s, background-color 0.15s;
  transition: color 0.15s, background-color 0.15s;
  /* &.ng-leave {
    -webkit-animation: fadeOut .2s;
    -moz-animation: fadeOut .2s;
    -ms-animation: fadeOut .2s;
    animation: fadeOut .2s;
  }*/
}
.slide-in-fade-out.ng-enter {
  display: none;
  -webkit-animation: fadeInLeft 0.3s;
  -moz-animation: fadeInLeft 0.3s;
  -ms-animation: fadeInLeft 0.3s;
  animation: fadeInLeft 0.3s;
}
.slide-in-fade-out.right.ng-enter {
  display: none;
  -webkit-animation: fadeInRight 0.3s;
  -moz-animation: fadeInRight 0.3s;
  -ms-animation: fadeInRight 0.3s;
  animation: fadeInRight 0.3s;
}
.slide-in-fade-out.bottom.ng-enter {
  opacity: none;
  -webkit-animation: fadeInUp 0.3s;
  -moz-animation: fadeInUp 0.3s;
  -ms-animation: fadeInUp 0.3s;
  animation: fadeInUp 0.3s;
}
.slide-in-fade-out.ng-enter-active {
  display: block !important;
}
.slide-in-fade-out.loading.ng-leave,
.slide-in-fade-out.ng-leave {
  display: none;
}
.fade-in-fade-out {
  opacity: 1;
}
.fade-in-fade-out.ng-enter {
  opacity: 0;
  -webkit-animation: fadeIn 0.3s;
  -moz-animation: fadeIn 0.3s;
  -ms-animation: fadeIn 0.3s;
  animation: fadeIn 0.3s;
}
.fade-in-fade-out.ng-enter.delay {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
  transition-delay: 0.2s;
}
.fade-in-fade-out.up.ng-enter {
  opacity: 1;
  -webkit-animation: fadeInUp 0.3s;
  -moz-animation: fadeInUp 0.3s;
  -ms-animation: fadeInUp 0.3s;
  animation: fadeInUp 0.3s;
}
.fade-in-fade-out.ng-leave {
  display: none;
  /*opacity:0;
    -webkit-animation: fadeOut .2s;
    -moz-animation: fadeOut .2s;
    -ms-animation: fadeOut .2s;
    animation: fadeOut .2s; 
    &.up
    {
      -webkit-animation: fadeOutUp .3s;
      -moz-animation: fadeOutUp .3s;
      -ms-animation: fadeOutUp .3s;
      animation: fadeOutUp .3s;
    }*/
}
.loading-header + .mdl-spinner {
  margin-left: 14px;
}
.stagger-fade h1,
.stagger-fade h2,
.stagger-fade h3,
.stagger-fade h4,
.stagger-fade h5,
.stagger-fade h6 {
  display: inline-block;
  /*needed for chrome to animate?*/
  position: relative;
}
.stagger-fade.ng-enter {
  /* standard transition code */
  transition: 0.5s linear all;
  -webkit-transition: 0.5s linear all;
  opacity: 0;
}
.stagger-fade.ng-enter-stagger,
.fade-in-fade-out.ng-enter-stagger {
  /* this will have a 100ms delay between each successive leave animation */
  transition-delay: 0.1s;
  -webkit-transition-delay: 0.1s;
  /* in case the stagger doesn't work then the duration value
   must be set to 0 to avoid an accidental CSS inheritance */
  transition-duration: 0s;
  -webkit-transition-duration: 0s;
}
.stagger-fade.ng-enter.ng-enter-active {
  /* standard transition styles */
  opacity: 1;
}
.text-zoom {
  -webkit-transition: color 0.15s, background-color 0.15s;
  -moz-transition: color 0.15s, background-color 0.15s;
  -ms-transition: color 0.15s, background-color 0.15s;
  transition: color 0.15s, background-color 0.15s;
  -webkit-animation: fadeIn 0.3s;
  -moz-animation: fadeIn 0.3s;
  -ms-animation: fadeIn 0.3s;
  animation: fadeIn 0.3s;
}
/**
 * Now that all app-wide styles have been applied, we can load the styles for
 * all the submodules and components we are using. 
 *
 * TODO: In a later version of this boilerplate, I'd like to automate this.
 */
.header h1 {
  margin-top: 50px;
  padding-bottom: 30px;
  width: 100%;
}
.header h2 {
  margin: 0 15px;
}
.fade.in {
  background-color: rgba(0, 0, 0, 0.5);
}
.center-absolute {
  position: absolute;
  right: 50%;
  top: 50%;
}
.center-absolute > *:first-child {
  right: -50%;
  top: -50%;
}
.login-status {
  position: absolute;
  right: 20px;
  z-index: 9999;
}
.login-status.center {
  right: 50%;
}
.login-status.center .status-inner {
  right: -50%;
}
.login-status .status-inner {
  position: relative;
}
.login-status .status-inner.mdl-card {
  min-width: auto;
}
.login-status .status-inner .mdl-spinner {
  align-self: center;
  margin-left: 20px;
}
.login-status.ng-enter {
  animation: swift-out 0.12s cubic-bezier(0.55, 0, 0.1, 1);
  animation-fill-mode: forwards;
}
[ng-cloak] {
  display: none !important;
}
@keyframes swift-out {
  0% {
    top: 0px;
  }
  100% {
    top: 60px;
  }
}
.loading-ellipsis {
  font-size: 30px;
}
.loading-ellipsis:after {
  overflow: hidden;
  display: inline-block;
  vertical-align: bottom;
  -webkit-animation: ellipsis steps(4, end) 900ms infinite;
  animation: ellipsis steps(4, end) 900ms infinite;
  content: "\2026";
  /* ascii code for the ellipsis character */
  width: 0px;
}
.md-select-menu-container,
.md-open-menu-container {
  z-index: 99999999999;
}
@keyframes ellipsis {
  to {
    width: 1.25em;
  }
}
@-webkit-keyframes ellipsis {
  to {
    width: 1.25em;
  }
}
@media screen and (max-width: 393px) {
  .chosen-container:nth-of-type(even) {
    margin-top: 10px;
  }
}
md-slider .md-track {
  background: rgba(0, 0, 0, 0.38);
}
.theme-site .md-select-menu-container.md-active md-select-menu {
  border-radius: 8px;
}
.theme-site .md-standard-list-container.md-autocomplete-suggestions-container {
  border-radius: 8px;
}
.theme-site .link.md-button.pair-button {
  box-shadow: none;
  margin-top: 0px;
  color: rgba(33, 33, 33, 0.5);
  text-transform: none;
  border: 1px solid rgba(33, 33, 33, 0.1);
  transition: 250ms all;
  min-height: 30px;
  line-height: 30px;
  font-size: 14px;
  border-radius: 8px;
}
.theme-site .link.md-button.pair-button:not([disabled]) {
  color: black;
  border: 1px solid rgba(33, 33, 33, 0.5);
}
.theme-site .link.md-button.pair-button:not([disabled]):hover {
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  border-color: transparent;
}
.theme-site .link.md-button.pair-button.stitched-files {
  background-color: rgba(66, 139, 202, 0.15);
  border-color: rgba(66, 139, 202, 0.15);
}
.theme-site .link.md-button.pair-button.stitched-files:not([disabled]):hover {
  box-shadow: 0 2px 5px 0 rgba(66, 139, 202, 0.15);
}
.theme-site .capitalize {
  text-transform: capitalize;
}
.theme-site #prs-progress + #prs-run-button {
  margin-top: 10px;
}
.theme-site md-progress-circular + #prs-progress-container {
  margin-top: 10px;
}
.theme-site div.ag-root .ag-cell-focus {
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}
.theme-site .link.md-button.pair-button:not([disabled]).md-primary {
  background-color: #428bca;
  border: #428bca;
  color: white;
  font-weight: 700;
}
.theme-site .link.pair-button.with-icon {
  margin-top: 8px;
  padding-right: 19px;
}
.theme-site md-radio-button.md-checked .md-on {
  transform: scale(0.5);
  background: #428bca;
  width: 20px;
}
.md-select-menu-container,
.md-open-menu-container {
  z-index: 999999important;
  border-radius: 8px;
  background: #fff;
}
md-tooltip,
md-tooltip .md-content,
.md-tooltip {
  font-size: 14px !important;
  white-space: normal !important;
  word-wrap: break-word !important;
  max-width: 300px !important;
  text-overflow: clip !important;
  overflow: visible !important;
  line-height: 1.4 !important;
  padding: 8px 12px !important;
}
.theme-site .link.md-button.pair-button.select-all-button {
  border: transparent;
}
.theme-site .link.md-button.pair-button.md-warn {
  color: #d32f2f;
  border-color: #d32f2f;
  background-color: #fff8f8 !important;
}
.theme-site .link.md-button.pair-button.md-warn md-icon {
  color: #d32f2f !important;
}
.theme-site .link.md-button.pair-button.md-warn:hover:not([disabled]) {
  background: #d32f2f !important;
  border-color: #d32f2f !important;
}
.theme-site .link.md-button.pair-button.md-warn:hover:not([disabled]) md-icon {
  color: #FFFFFF !important;
}
.theme-site .ag-root-wrapper.ag-layout-normal {
  border-radius: 8px;
}
@media (max-width: 768px) {
  .theme-site .manage-experiments-title {
    font-size: 32px;
  }
}
.admin-header {
  margin-top: 40px;
  margin-bottom: 50px;
  padding-bottom: 40px;
  border-bottom: 1px solid #e8e8e8;
  text-align: center;
  width: 100%;
}
.admin-header .admin-header-icon {
  width: 80px;
  height: 80px;
  margin: 0 auto 24px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 24px rgba(102, 126, 234, 0.35);
}
.admin-header .admin-header-icon md-icon {
  font-size: 36px !important;
  width: 36px !important;
  height: 36px !important;
  color: white;
}
.admin-header .admin-header-icon.jobs-icon {
  background: linear-gradient(135deg, #428bca 0%, #2a6496 100%);
  box-shadow: 0 8px 24px rgba(66, 139, 202, 0.35);
}
.admin-header .admin-title {
  font-weight: 300;
  font-size: 42px;
  color: #333;
  margin: 0;
  letter-spacing: -0.5px;
}
.pagination-container {
  background: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  border-radius: 20px !important;
  position: relative !important;
}
.pagination-container::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.05) 50%, rgba(0, 0, 0, 0.02) 100%);
  border-radius: 20px;
  pointer-events: none;
  z-index: 0;
}
.pagination-container > div {
  position: relative;
  z-index: 1;
}
.pagination-container .pagination-nav-btn {
  color: #555 !important;
  background: rgba(255, 255, 255, 0.6) !important;
  border: 1px solid rgba(66, 139, 202, 0.15) !important;
  border-radius: 50% !important;
  width: 42px !important;
  height: 42px !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
.pagination-container .pagination-nav-btn:hover:not([disabled]) {
  background: rgba(66, 139, 202, 0.15) !important;
  border-color: rgba(66, 139, 202, 0.4) !important;
  color: #428bca !important;
  transform: translateY(-2px) scale(1.05) !important;
}
.pagination-container .pagination-nav-btn[disabled] {
  color: #ccc !important;
  background: rgba(255, 255, 255, 0.3) !important;
  border-color: rgba(0, 0, 0, 0.05) !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}
.pagination-container .pagination-nav-btn md-icon {
  font-size: 18px !important;
}
.pagination-container .pagination-page-btn {
  font-size: 14px !important;
  font-weight: 600 !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  border-radius: 50% !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
.pagination-container .pagination-page-btn.md-default {
  background: rgba(255, 255, 255, 0.7) !important;
  color: #444 !important;
  border: 1px solid rgba(66, 139, 202, 0.15) !important;
}
.pagination-container .pagination-page-btn.md-default:hover:not([disabled]) {
  background: rgba(66, 139, 202, 0.08) !important;
  border-color: rgba(66, 139, 202, 0.3) !important;
  color: #428bca !important;
  transform: translateY(-2px) scale(1.08) !important;
}
.pagination-container .pagination-page-btn.md-primary {
  background: #428bca !important;
  color: white !important;
  border: 1px solid rgba(66, 139, 202, 0.3) !important;
}
.pagination-container .pagination-page-btn.md-primary:hover {
  background: #36465d !important;
  transform: translateY(-2px) scale(1.08) !important;
}
.pagination-container > div:last-child {
  color: rgba(0, 0, 0, 0.65) !important;
  font-weight: 500 !important;
  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.8) !important;
}
@media (max-width: 600px) {
  .pagination-container {
    padding: 16px 12px !important;
    border-radius: 16px !important;
  }
  .pagination-container .pagination-page-btn {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    font-size: 12px !important;
    margin: 0 1px !important;
  }
  .pagination-container .pagination-page-btn:hover:not([disabled]) {
    transform: translateY(-1px) scale(1.05) !important;
  }
  .pagination-container .pagination-page-btn.md-primary:hover {
    transform: translateY(-1px) scale(1.05) !important;
  }
  .pagination-container .pagination-nav-btn {
    width: 36px !important;
    height: 36px !important;
    margin: 0 3px !important;
  }
  .pagination-container .pagination-nav-btn:hover:not([disabled]) {
    transform: translateY(-1px) scale(1.05) !important;
  }
  .pagination-container .pagination-nav-btn md-icon {
    font-size: 16px !important;
  }
  .pagination-container > div:last-child {
    font-size: 12px !important;
    margin-top: 8px !important;
  }
}
.theme-site sq-loading {
  display: block;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 999;
}
.theme-site sq-loading .route-loading-error-card {
  pointer-events: auto;
}
.theme-site .sq-loading {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 999;
}
.theme-site .sq-loading .search-loading {
  position: relative;
  left: -50%;
}
/**
 * Footer
 */
.footer {
  border-top: 1px solid #428bca;
  margin-top: 28px;
}
.footer .footer-inner {
  padding: 9px 0;
}
.footer .footer-inner p {
  margin: 0;
}
.footer .social {
  float: right;
  margin: 0;
  list-style: none;
}
.footer .social li {
  float: left;
  margin-left: 20px;
}
.footer .social li a,
.footer .social li a:visited {
  color: #d4d4d4;
  font-size: 26px;
  text-decoration: none;
  transition: 250ms ease-in-out;
}
.footer .social li a:hover,
.footer .social li a:visited:hover {
  color: #212121;
}
.home {
  text-align: center;
  height: 100%;
  width: 100%;
}
.home .btn {
  font-size: 21px;
  padding: 14px 24px;
}
.home .lead {
  font-size: 24px;
  line-height: 1.25;
}
.home .list-inline > li {
  max-width: 120px;
}
.marketing {
  text-align: center;
}
.marketing .row {
  /* margin-top: 0px; */
  background-color: #eee;
  margin-bottom: 0;
  border-radius: 0;
  text-align: left;
}
.marketing .row.even {
  text-align: right;
  background-color: #fff;
}
.marketing h4 [class*=" icon-"],
.marketing h4 [class^="icon-"] {
  margin-right: 5px;
  vertical-align: -10%;
  font-size: 28px;
  line-height: 1;
}
md-list-item.full-width {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.loading-header {
  position: relative;
}
.visualization {
  align-items: flex-start;
  display: flex;
  flex: 1 1 0;
  flex-flow: row nowrap;
  justify-content: center;
  width: 100%;
}
.vertical-text {
  white-space: pre-wrap;
  text-align: center!important;
}
.rotate-180 {
  transform: rotate(180deg);
}
.editable {
  position: relative;
  outline: none;
  cursor: pointer;
  cursor: hand;
}
.editable:hover:before {
  content: "Edit";
  background: rgba(255, 255, 255, 0.9);
  width: 100%;
  height: 100%;
  position: absolute;
  text-align: left;
  font-weight: 500;
}
.column-dropdown {
  display: flex !important;
  flex-direction: column !important;
}
.wide-dropdown {
  min-width: 500px !important;
  width: 600px !important;
  max-width: 90vw !important;
}
.status {
  margin-top: 11px;
}
h1 .material-progress {
  margin-bottom: 0;
  width: auto;
  height: 2px;
}
.hero.top {
  padding-top: 0px;
}
.progress-wrapper {
  max-height: 300px !important;
  overflow-y: scroll;
}
.progress-wrapper.expand-height {
  max-height: 500px !important;
}
.progress-wrapper md-progress-circular {
  position: relative;
  top: 20px;
}
.progress-wrapper .md-fab.expand i {
  font-size: 25px;
  line-height: 37px;
}
.progress-wrapper.log:hover {
  cursor: pointer;
  cursor: blank;
}
.progress-wrapper .md-button.expand {
  position: absolute;
  top: 0px;
  left: 0px;
}
.site-layout-single .progress-wrapper {
  display: none;
}
.progress-text {
  left: 50%;
  margin-bottom: 0 !important;
  margin-top: 0;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}
.progress-text + .progress-text {
  top: 60%;
}
.progress-text.notification-count {
  cursor: pointer;
  font-size: 16px;
  height: 32px;
  left: 66% !important;
  line-height: 1;
  min-height: auto;
  min-width: auto;
  position: absolute;
  top: 30%;
  width: 32px;
  z-index: 1;
}
.progress-text.notification-count.left {
  left: 47%;
}
.status button {
  position: absolute;
  right: 5px;
  top: 5px;
}
.status {
  border: 1px solid;
  display: block;
  margin: 0 auto;
  padding: 20px;
  position: relative;
  transition: 0.5s all;
  border-radius: 3px;
  border-color: #d4d4d4;
}
.status .status button {
  background-color: #fff;
  border: 1px solid;
  border-radius: 8px;
  box-shadow: none;
  position: absolute;
  right: 5px;
  top: 5px;
}
.status button {
  background-color: #FFFFFF;
  border: 1px solid #d4d4d4;
  border-radius: 8px;
  right: 5px;
  top: 5px;
  color: #d4d4d4;
}
.status button:hover {
  color: #428bca;
  border-color: #428bca;
}
.status .message-container {
  height: 191px;
  margin-top: 10px;
}
.status .message-container .repeat-item {
  padding: 10px;
}
.progress-circle {
  bottom: 0;
  height: 282px !important;
  padding: 0 !important;
  position: absolute !important;
  width: 238px !important;
}
.progress-circle .round-progress > circle:first-child {
  stroke: #d4d4d4 !important;
}
.round-progress-wrapper {
  display: flex;
  height: 100%;
  padding-bottom: 0 !important;
}
.round-progress {
  max-height: 310px !important;
  width: 100% !important;
  position: relative !important;
}
#login-form md-content {
  position: static;
}
md-progress-linear {
  height: 0;
}
md-progress-linear .md-container {
  display: block;
  height: 1px;
  overflow: hidden;
  position: relative;
  top: -22px;
  transform: translate(0px, 0px) scale(1, 1);
  width: 100%;
}
md-progress-linear.md-default-theme .md-container,
md-progress-linear .md-container,
.mdl-progress__indeterminate {
  background-color: #212121;
}
md-progress-linear.md-default-theme .md-bar,
md-progress-linear .md-bar {
  background-color: #428bca;
}
md-card-content.progress-wrapper .md-subheader {
  background-color: #FFFFFF;
  z-index: 1 !important;
}
md-card-content.progress-wrapper .md-subheader.primary {
  background-color: #428bca;
  color: #FFFFFF;
}
md-card-content.progress-wrapper .md-subheader.accent {
  background-color: #a54243;
  color: #FFFFFF;
}
.virtualRepeatdemoScrollTo .wrapper {
  width: 400px;
}
.virtualRepeatdemoScrollTo #vertical-container {
  height: 292px;
  width: 400px;
}
.virtualRepeatdemoScrollTo #vertical-container .repeated-item {
  border-bottom: 1px solid #ddd;
  box-sizing: border-box;
  height: 40px;
  padding-top: 10px;
}
.virtualRepeatdemoScrollTo #vertical-container .repeated-item.header {
  background-color: #106CC8;
  color: white;
  text-align: center;
  font-weight: bold;
}
.virtualRepeatdemoScrollTo #vertical-container md-content {
  margin: 16px;
}
.virtualRepeatdemoScrollTo md-virtual-repeat-container {
  border: solid 1px grey;
}
.virtualRepeatdemoScrollTo .md-virtual-repeat-container .md-virtual-repeat-offsetter div:not(.header) {
  padding-left: 16px;
}
.annotation-title {
  margin-top: 0px;
}
md-list-item {
  text-align: left;
}
@media (max-width: 600px) {
  .site-layout-single .progress-wrapper:last-of-type {
    width: 320px;
  }
}
.job-progress-mini-spinner {
  display: none !important;
}
@media (max-width: 3200px) {
  .job-progress-spinner {
    display: none !important;
  }
  .job-progress-mini-spinner {
    display: inline-block !important;
    margin-right: 20px !important;
  }
  .job-progress-info-icon {
    display: none !important;
  }
  sq-job-info-card header-actions md-card-content {
    padding: 6px !important;
    margin: 10px !important;
    width: 100% !important;
    box-sizing: border-box;
    overflow: hidden;
  }
  sq-job-info-card header-actions md-card-content .refresh-button {
    margin-right: -3px;
  }
  sq-job-info-card header-actions md-card-content > md-card-content {
    max-width: calc(100% - 48px) !important;
    overflow: hidden;
    flex: 1;
    min-width: 0;
  }
  sq-job-info-card header-actions md-card-content > span:last-child {
    flex-shrink: 0;
    margin-right: -4px !important;
  }
  .job-progress-status {
    max-width: calc(100% - 48px);
    flex: 1 !important;
    min-width: 0;
    padding-left: 2px !important;
  }
  .job-progress-status > span {
    max-width: 100% !important;
  }
  header-actions > md-card-content {
    display: flex !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
  }
  header-actions > md-card-content > md-button {
    flex-shrink: 0 !important;
  }
}
#visualization {
  clear: both;
  float: left;
  width: 70%;
  min-width: 320px;
  min-height: 60vh;
  position: relative;
  overflow: visible;
}
foam-details,
.foam-details {
  max-height: inherit;
}
#visualization-default {
  width: 100%;
  align-self: center;
}
#visualization-details-overlay .close-button {
  position: absolute;
  right: 15px;
  top: 15px;
}
foam-details .close-foam-details,
.foam-details .close-foam-details {
  position: absolute !important;
  right: 10px;
  top: 10px;
  z-index: 999;
}
#visualization-search {
  display: block;
  float: none;
  margin: 0 auto;
}
#visualization-search .result-button {
  display: inline-block;
  margin-right: 10px;
}
#visualization-search .chosen-choices {
  background-image: none;
  border: 1px solid #212121;
  height: 34px !important;
  border-radius: 8px;
  box-shadow: none;
  display: block;
  padding: 4px 12px;
  width: 188px;
  overflow-y: scroll;
}
#visualization-search .chosen-choices input {
  text-align: center;
  display: table-cell;
  vertical-align: middle;
  height: 100%;
  font-family: inherit;
  color: #212121;
  font-size: 16px;
  padding: 0px;
  margin: 0px;
}
h2.chart-title {
  display: block;
  margin: 0 0px 7px 0px;
}
.foam-tree-container {
  float: left;
  width: 100%;
  flex: 1;
  display: flex;
  min-height: 500px;
}
.foam-tree-container #visualization-details {
  position: relative;
  height: 60vh;
}
.foam-tree-container #visualization-details-overlay {
  position: absolute;
  z-index: 9999;
  height: auto;
  max-height: 100%;
  right: 0px;
  top: 0;
  margin: 0;
  width: 100%;
}
.foam-tree-container md-card-content {
  overflow: scroll;
  max-height: 90%;
}
.foam-tree-container md-card-header {
  min-height: 40px;
}
.theme-site .link.md-button.pair-button.prs-button.active {
  background-color: #36465d !important;
  color: #FFFFFF !important;
  border-color: #36465d !important;
}
.theme-site .link.md-button.pair-button.prs-button.active md-icon {
  color: #FFFFFF !important;
}
sq-bar-chart {
  clear: both;
  display: block;
}
sq-bar-chart svg {
  height: 480px;
}
/*Hide x axis, to "fix" nvd3 bar width workaround resulting being NaN x values*/
.nv-x .nv-axis .tick text {
  display: none;
}
.md-list-item-text h5 {
  font-weight: 700;
}
.md-list-item-text .indent {
  padding-left: 16px;
}
.popgen-label-short {
  display: none;
}
@media screen and (max-width: 867px) {
  .popgen-label-full {
    display: none;
  }
  .popgen-label-short {
    display: inline;
  }
}
@media screen and (max-width: 767px) {
  #visualization {
    width: 96.5%;
  }
}
.theme-site .ag-theme-alpine,
.theme-site .ag-theme-alpine-dark {
  --ag-font-size: 14px;
  --ag-header-background-color: #36465d;
  --ag-header-foreground-color: #FFFFFF;
  --ag-header-column-separator-color: transparent;
  --ag-background-color: #FFFFFF;
  --ag-odd-row-background-color: #fafbfc;
  --ag-row-hover-color: rgba(66, 139, 202, 0.12);
  --ag-selected-row-background-color: rgba(66, 139, 202, 0.2);
  --ag-border-color: transparent;
  --ag-row-border-color: #f0f0f0;
  --ag-cell-horizontal-border: none;
  --ag-font-family: 'Roboto', sans-serif;
  --ag-header-height: 48px;
  --ag-row-height: 44px;
  --ag-borders: none;
  --ag-wrapper-border-radius: 8px;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12);
  border: none;
}
.theme-site .ag-theme-alpine .ag-root-wrapper,
.theme-site .ag-theme-alpine-dark .ag-root-wrapper {
  border: none;
  border-radius: 8px;
}
.theme-site .ag-theme-alpine .ag-header,
.theme-site .ag-theme-alpine-dark .ag-header {
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.8px;
  border-bottom: none;
  background-color: #36465d;
}
.theme-site .ag-theme-alpine .ag-header-cell-text,
.theme-site .ag-theme-alpine-dark .ag-header-cell-text {
  font-weight: 600;
  color: #FFFFFF;
}
.theme-site .ag-theme-alpine .ag-header-cell,
.theme-site .ag-theme-alpine-dark .ag-header-cell {
  padding: 0 16px;
  background-color: #36465d;
  color: #FFFFFF;
}
.theme-site .ag-theme-alpine .ag-header-cell:hover,
.theme-site .ag-theme-alpine-dark .ag-header-cell:hover {
  background-color: rgba(255, 255, 255, 0.1);
}
.theme-site .ag-theme-alpine .ag-header-cell-label,
.theme-site .ag-theme-alpine-dark .ag-header-cell-label {
  color: #FFFFFF;
}
.theme-site .ag-theme-alpine .ag-cell,
.theme-site .ag-theme-alpine-dark .ag-cell {
  display: flex;
  align-items: center;
  padding: 0 16px;
  font-size: 14px;
  color: #212121;
}
.theme-site .ag-theme-alpine .ag-row,
.theme-site .ag-theme-alpine-dark .ag-row {
  transition: background-color 0.15s ease;
  border-bottom: 1px solid #f5f5f5;
}
.theme-site .ag-theme-alpine .ag-row:last-child,
.theme-site .ag-theme-alpine-dark .ag-row:last-child {
  border-bottom: none;
}
.theme-site .ag-theme-alpine .ag-body-viewport,
.theme-site .ag-theme-alpine-dark .ag-body-viewport {
  background: #FFFFFF;
}
.theme-site #myGrid.ag-theme-alpine,
.theme-site #apoeGrid.ag-theme-alpine {
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12);
}
.theme-site #biplot.ng-hide {
  display: block !important;
  visibility: hidden;
  height: 0 !important;
  width: 0 !important;
  min-height: 0 !important;
  min-width: 0 !important;
}
.theme-site .popgen-card {
  box-sizing: border-box;
}
.theme-site .popgen-card md-content {
  background: transparent;
}
.theme-site .popgen-card .pair-button {
  background: #FFFFFF !important;
  border: 1px solid #e2e6ea !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  text-transform: none !important;
  padding: 0 12px !important;
  min-height: 36px !important;
  color: #212121 !important;
}
.theme-site .popgen-card .pair-button:not([disabled]):hover {
  background: #36465d !important;
  color: #FFFFFF !important;
  border-color: #36465d !important;
}
.theme-site .popgen-card .pair-button:not([disabled]):hover md-icon {
  color: #FFFFFF !important;
}
.theme-site .popgen-card .pair-button:active {
  transform: translateY(0);
  box-shadow: 0 2px 4px rgba(54, 70, 93, 0.15) !important;
}
.theme-site .popgen-card .pair-button md-icon {
  font-size: 18px !important;
  color: #428bca !important;
  transition: color 0.2s ease;
  line-height: 22px;
}
.theme-site .popgen-container {
  margin-top: 10px;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  overflow-x: hidden;
}
.theme-site .popgen-row {
  display: flex;
  flex-direction: row;
  width: 99%;
  height: 100%;
  padding: 24px;
  gap: 24px;
  box-sizing: border-box;
}
.theme-site .popgen-row .js-plotly-plot,
.theme-site .popgen-row #biplot,
.theme-site .popgen-row #prs-histogram {
  opacity: 0!important;
  transition: opacity 1s ease-in-out;
}
.theme-site .popgen-row .js-plotly-plot.plot-ready,
.theme-site .popgen-row #biplot.plot-ready,
.theme-site .popgen-row #prs-histogram.plot-ready {
  opacity: 1!important;
}
.theme-site .popgen-row .popgen-row {
  padding: 0 !important;
}
.theme-site .popgen-body {
  justify-content: center;
  align-items: flex-start;
  background: transparent;
  width: 100%;
}
.theme-site .popgen-body > * {
  background: #FFFFFF;
}
.theme-site .popgen-wait {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 100%;
  padding: 24px;
}
.theme-site .popgen-plot {
  flex: 1 1 55%;
  min-width: min(400px, 100%);
  height: 58vh;
  min-height: 360px;
  background: #FFFFFF;
  box-sizing: border-box;
}
.theme-site .popgen-plot.ng-hide {
  width: 0px;
  min-width: 0px;
  height: 0px;
  min-height: 0px;
  flex: 0 0 0;
}
.theme-site .popgen-table-panel {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  flex: 1 1 45%;
  min-width: min(380px, 100%);
  height: calc(58vh - 20px);
  min-height: 360px;
  box-sizing: border-box;
}
.theme-site .prs-content {
  min-height: 300px;
  background: #fff;
  box-sizing: border-box;
}
.theme-site .prs-chart-panel {
  display: flex;
  flex-direction: column;
}
.theme-site .prs-table-panel {
  display: flex;
  flex-direction: column;
}
.theme-site .popgen-stats-row {
  width: 100%;
  padding: 0;
  gap: 16px;
}
.theme-site .popgen-stats-row .popgen-plot {
  flex: 1 1 auto;
  min-width: 0;
  height: auto;
  min-height: auto;
}
.theme-site .popgen-stats-row .popgen-table-panel {
  flex: 0 0 auto;
  width: 100%;
  max-width: 600px;
  min-width: 280px;
  height: auto;
  min-height: auto;
}
.theme-site .popgen-card {
  width: calc(100% - 16px) !important;
  max-width: calc(100% - 16px);
  overflow: hidden;
  box-sizing: border-box;
}
.theme-site .popgen-nav {
  display: flex;
  flex-wrap: wrap;
}
.theme-site .popgen-nav .popgen-button {
  background: #FFFFFF !important;
  border: 1px solid #e2e6ea !important;
  border-radius: 24px !important;
  font-weight: 500 !important;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
  padding: 0 12px !important;
}
.theme-site .popgen-nav .popgen-button.selected {
  background: #36465d !important;
  color: #FFFFFF !important;
  border-color: #36465d !important;
  box-shadow: 0 2px 8px rgba(54, 70, 93, 0.25) !important;
}
.theme-site .popgen-nav .popgen-button.selected md-icon.primary {
  color: #FFFFFF !important;
  margin-right: 5px;
  margin-bottom: 3px;
}
.theme-site .popgen-nav .popgen-button:hover:not(.selected) {
  border-color: #36465d !important;
  color: #36465d !important;
  background: rgba(54, 70, 93, 0.05) !important;
}
.theme-site .ancestry-section-title {
  color: #36465d;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.3px;
  margin: 0;
  display: flex;
  align-items: center;
}
.theme-site .ancestry-section-title::before {
  content: '';
  width: 4px;
  height: 18px;
  background: #428bca;
  border-radius: 2px;
  margin-right: 10px;
}
.theme-site sq-search-hints {
  position: absolute;
  top: -31px;
  left: -14px;
  z-index: 1;
  width: 10px;
  height: 10px;
}
.theme-site .annotation-result-buttons {
  /*float: left;
    margin-bottom: -30px;
    margin-left: 20px;
    opacity: 1;
    padding: 0 !important;
    position: relative;
    right: 0;
    width: auto;*/
  /*&.ng-enter
    {
      transition: .7s linear all;
      -webkit-transition: .7s linear all;
      -moz-transition: .7s linear all;
      -o-transition: .7s linear all;
      left:-100px;
      opacity:0;
      position:relative
    }*/
  /*Todo: make button border radius a variable*/
}
.theme-site .annotation-result-buttons .btn,
.theme-site .annotation-result-buttons form {
  display: inline-block;
}
.theme-site .annotation-result-buttons .btn {
  /*border-radius: 50%;
      font-size: 16px;
      height: 50px;
      line-height: 0;
      margin-bottom: 0;
      padding: 24px 0 0;
      width: 50px !important;*/
}
.theme-site .annotation-result-buttons .btn.fa-cloud-download {
  padding-top: 0;
}
.theme-site .annotation-result-buttons .fa > span {
  margin-left: 5px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  /*to do, define font family site wide*/
}
.theme-site .annotation-result-buttons .btn-sm,
.theme-site .annotation-result-buttons .btn-group-sm > .btn {
  font-size: 16px;
}
.theme-site .annotation-result-buttons input {
  margin-top: 0;
}
.theme-site .annotation-result-buttons.ng-enter.ng-enter-active {
  left: 0px;
  opacity: 1;
}
.theme-site .annotation-result-buttons form .btn {
  margin: 0;
}
.theme-site .annotation-result-buttons .btn-group .btn:first-of-type:not(':last-child') {
  border-top-left-radius: 3px !important;
  border-bottom-left-radius: 3px !important;
}
.theme-site #result_chooser_chosen {
  margin-bottom: 6px;
}
.theme-site .top #result-choose-container {
  transition: all 300ms ease 0s;
  margin-bottom: 20px;
}
.theme-site .top #result-choose-container > h2 {
  margin-top: 0;
  margin-bottom: 0;
}
.theme-site .top #result-choose-container #result_chooser_chosen {
  margin-bottom: 0px;
}
.theme-site .chosen-container-multi .chosen-choices li.search-choice {
  background-clip: padding-box;
  background-color: #FFFFFF;
  background-image: none;
  border: 1px solid #428bca;
  border-radius: 8px;
  box-shadow: none;
  color: #212121;
  cursor: default;
  line-height: 13px;
  margin: 0;
  padding: 5px 20px 5px 5px;
  position: relative;
}
.theme-site .chosen-container-multi .chosen-choices li.search-field {
  padding: 0px;
  white-space: nowrap;
  height: 100%;
}
.theme-site .chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
  /*  background: rgba(0, 0, 0, 0) url("chosen-sprite.png") no-repeat scroll -42px 1px;
    display: block;
    font-size: 1px;
    height: 12px;*/
  position: absolute;
  right: 4px;
  top: 6px;
  width: 12px;
}
.theme-site #result-chooser .ui-select-match {
  width: 207.5px;
}
.theme-site #result-chooser .ui-select-search {
  width: 207.5px;
}
.theme-site .loading-indicator-narrow {
  min-width: 225px;
}
.theme-site .loading-indicator h1 {
  margin-right: 20px;
}
.theme-site .mode-search {
  overflow: hidden;
  background-color: red;
}
.theme-site .mode-search .form,
.theme-site .mode-search .icon-close {
  opacity: 1;
  transform: none;
  pointer-events: all;
}
.theme-site .mode-search .control .icon-search {
  opacity: 0;
}
.theme-site .mode-search .control .btn {
  transform: scale(70);
}
.theme-site #result-toolbar {
  background-color: #fff;
  border-bottom: 1px solid #e5e5e5;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  margin-bottom: 16px;
}
.theme-site #result-toolbar .md-toolbar-tools {
  max-height: none;
  height: 78px;
}
.theme-site #result-toolbar .md-toolbar-tools label {
  font-size: 1rem;
}
@media (max-width: 1400px) {
  .theme-site .popgen-row {
    flex-direction: column !important;
    padding: 20px !important;
    gap: 20px !important;
    height: auto !important;
  }
  .theme-site .popgen-row .popgen-row {
    padding: 0 !important;
  }
  .theme-site .popgen-plot {
    width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
    height: 50vh !important;
    min-height: 320px !important;
  }
  .theme-site .popgen-table-panel {
    width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
    height: 50vh !important;
    min-height: 320px !important;
  }
  .theme-site .popgen-stats-row {
    max-width: calc(100% - 16px);
    flex-direction: column !important;
    gap: 0px !important;
    padding: 0 !important;
    width: 99% !important;
  }
  .theme-site .popgen-stats-row .popgen-plot,
  .theme-site .popgen-stats-row .popgen-table-panel {
    width: 100% !important;
    max-width: 100% !important;
  }
}
@media (max-width: 867px) {
  .theme-site .chips-scroll-wrapper {
    position: relative;
    overflow: hidden;
  }
  .theme-site .chips-scroll-wrapper::after {
    content: '›';
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    font-size: 18px;
    color: #bbb;
    padding: 0 4px 0 40px;
    background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.7) 30%, #ffffff 70%);
    pointer-events: none;
    z-index: 1;
  }
  .theme-site .chips-scroll-container {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    padding-right: 32px;
  }
  .theme-site .md-chips {
    flex-wrap: nowrap !important;
  }
  .theme-site .md-chips md-chip,
  .theme-site .md-chips .md-chip {
    flex-shrink: 0 !important;
    max-width: none !important;
    width: auto !important;
  }
  .theme-site .md-chips md-chip .md-chip-content,
  .theme-site .md-chips .md-chip .md-chip-content,
  .theme-site .md-chips md-chip > span,
  .theme-site .md-chips .md-chip > span,
  .theme-site .md-chips md-chip > div,
  .theme-site .md-chips .md-chip > div {
    max-width: none !important;
    width: auto !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
  }
}
@media (max-width: 480px) {
  .theme-site #prs-study-selector {
    flex-wrap: wrap !important;
    gap: 8px !important;
    padding: 12px 16px !important;
  }
  .theme-site #prs-study-selector md-select {
    max-width: 100% !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  .theme-site .hide-narrow {
    display: none !important;
  }
  .theme-site .popgen-container {
    width: calc(100% - 20px) !important;
    margin: 0 10px !important;
    box-sizing: border-box !important;
  }
  .theme-site .popgen-card {
    width: calc(100% - 4px) !important;
    margin: 0 2px !important;
  }
  .theme-site .popgen-row {
    padding: 12px !important;
    gap: 12px !important;
    width: calc(100% - 4px) !important;
  }
  .theme-site .popgen-content-padded {
    padding: 12px !important;
  }
  .theme-site .popgen-nav {
    display: flex !important;
    flex-wrap: wrap !important;
    padding: 8px 0 !important;
    width: 100% !important;
  }
  .theme-site .popgen-plot,
  .theme-site .popgen-table-panel {
    height: 45vh !important;
    min-height: 280px !important;
  }
  .theme-site .prs-content {
    flex-direction: column !important;
  }
  .theme-site .prs-content .popgen-plot,
  .theme-site .prs-content .popgen-table-panel,
  .theme-site .prs-content .prs-chart-panel,
  .theme-site .prs-content .prs-table-panel {
    width: 100% !important;
    min-width: 0 !important;
  }
  .theme-site .popgen-stats-row {
    width: calc(100% - 4px) !important;
    padding: 0 !important;
  }
  .theme-site .prs-content .pair-button {
    font-size: 12px !important;
    padding: 0 8px !important;
  }
}
.theme-site #filters-toggle.selected {
  background: #36465d !important;
  color: #FFFFFF !important;
  border-color: #36465d !important;
  box-shadow: 0 2px 8px rgba(54, 70, 93, 0.25) !important;
}
.theme-site #filters-toggle.selected md-icon.primary {
  color: #FFFFFF !important;
}
.theme-site md-menu-content .md-button {
  text-align: left;
}
.theme-site .md-icon-button.wings {
  margin-left: 0px !important;
  margin-right: 0px !important;
}
.theme-site .no-outline {
  outline: none;
}
.theme-site md-card.overview-search-card .md-actions,
.theme-site md-card.overview-search-card md-card-actions {
  margin: 8px;
  text-align: right;
}
.theme-site .search-loading {
  left: 50%;
  position: absolute;
  top: 0;
  z-index: 2;
}
.theme-site .has-tooltip {
  cursor: pointer;
  cursor: hand;
}
.theme-site #search-container {
  position: relative;
  z-index: 1;
  width: 100%;
  min-height: 60px;
}
.theme-site #search-container md-card-content > * {
  text-align: left;
}
.theme-site #search-container md-card-title > * {
  display: block;
  text-align: center;
  margin: 0 auto;
}
.theme-site #search-container.searching::after {
  content: '';
  background-color: rgba(255, 255, 255, 0.5);
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
}
.theme-site .initial-text-align {
  text-align: initial;
}
.theme-site md-menu-bar button {
  background-color: transparent;
  border: 0 none;
  font-size: 16px;
  height: 40px;
  margin: 0;
  padding: 0 10px;
}
.theme-site md-menu md-button i {
  top: -2px;
  position: relative;
}
.theme-site md-menu-bar .md-menu {
  display: inline-block;
  padding: 0;
  position: relative;
}
.theme-site .md-open-menu-container {
  background-color: white;
}
.theme-site #full-card-container button.expand i {
  font-size: 16px;
}
.theme-site md-card.overview-search-card,
.theme-site #search-sort-menu {
  /* Fixes crazy height overflow */
  min-height: min-content !important;
  box-shadow: none !important;
  border: 1px solid #e0e0e0 !important;
}
.theme-site .filter-list md-list {
  max-height: 320px;
  overflow: scroll;
  border-bottom: 1px solid #d3d3d3;
  border-top: 1px solid #d3d3d3;
  word-break: break-all;
}
.theme-site .filter-list md-list md-chip {
  word-break: keep-all;
  margin-left: 10px;
}
.theme-site .filter-list md-list .md-list-item-inner {
  margin-bottom: 10px;
}
.theme-site .filter-list:last-child md-list {
  border-bottom: 0px;
}
.theme-site md-checkbox .md-icon::after {
  box-sizing: border-box;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  left: 4.66667px;
  top: 0.22222px;
  display: table;
  width: 6.66667px;
  height: 13.33333px;
  border-width: 2px;
  border-style: solid;
  border-top: 0;
  border-left: 0;
  content: "";
  color: #efefef;
}
.theme-site md-checkbox.md-checked .md-icon::after {
  color: #fff;
}
.theme-site md-checkbox.negative .md-icon::after {
  box-sizing: border-box;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  position: absolute;
  left: 4.66667px;
  top: 0.22222px;
  display: table;
  width: 6.66667px;
  height: 13.33333px;
  border-width: 2px;
  border-bottom: 0px;
  border-style: solid;
  border-top: 0;
  border-left: 0;
  content: "";
  color: #efefef;
}
.theme-site md-checkbox.negative.md-checked .md-icon::after {
  box-sizing: border-box;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  position: absolute;
  left: 4.66667px;
  top: 0.22222px;
  display: table;
  width: 6.66667px;
  height: 13.33333px;
  border-width: 2px;
  border-bottom: 0px;
  border-style: solid;
  border-top: 0;
  border-left: 0;
  content: "";
}
.theme-site md-checkbox[disabled] {
  color: #d4d4d4 !important;
}
.theme-site .md-chips {
  outline: none;
}
.theme-site .md-chips md-chip {
  background: #d4d4d4;
  outline: none;
  overflow: hidden;
}
.theme-site md-chip-template {
  outline: none;
}
.theme-site md-chip-template:hover {
  color: #428bca;
}
.theme-site .show-over {
  display: none;
}
.theme-site md-chip-template.highlight .show-over {
  display: block;
}
.theme-site md-chip-template.highlight .hide-over {
  display: none;
}
.theme-site #search-content {
  position: relative;
  min-height: 80px;
}
.theme-site md-list.short {
  max-height: 400px;
  overflow: scroll;
}
.theme-site md-list.tall {
  max-height: 800px;
  overflow: scroll;
}
.theme-site div + .indel-slider-container {
  margin-left: 20px !important;
}
.theme-site .indel-slider-container {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 16px 0;
  padding: 0;
}
.theme-site .indel-slider-header {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  font-weight: 500;
  color: #495057;
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: 12px 20px;
  border-radius: 20px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
  width: fit-content;
  max-width: 400px;
}
.theme-site .indel-slider-header .indel-slider-icon {
  font-size: 16px;
  color: #10b981;
  opacity: 0.8;
}
.theme-site .indel-slider-header .indel-slider-title {
  font-weight: 600;
  font-size: 13px;
  color: #495057;
  margin-right: 8px;
  opacity: 0.9;
}
.theme-site .indel-slider-wrapper {
  flex: 1;
  margin: 0 12px;
  min-width: 120px;
  max-width: 200px;
}
.theme-site .indel-position-slider {
  margin: 0;
}
.theme-site .indel-position-slider .md-track {
  background-color: rgba(156, 163, 175, 0.3) !important;
  height: 4px !important;
  border-radius: 2px;
}
.theme-site .indel-position-slider .md-track-fill {
  background-color: #10b981 !important;
  border-radius: 2px;
}
.theme-site .indel-position-slider .md-thumb {
  background-color: #ffffff !important;
  border: 2px solid #10b981 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important;
  width: 16px !important;
  height: 16px !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.theme-site .indel-position-slider .md-thumb:hover,
.theme-site .indel-position-slider .md-thumb.md-focused {
  border-color: #059669 !important;
  box-shadow: 0 2px 6px rgba(16, 185, 129, 0.3) !important;
  transform: scale(1.1);
}
.theme-site .indel-position-slider .md-focus-ring {
  background-color: rgba(16, 185, 129, 0.2) !important;
  border: 2px solid rgba(16, 185, 129, 0.3) !important;
}
.theme-site .indel-position-display {
  display: inline-flex;
  align-items: center;
  background: rgba(156, 163, 175, 0.2);
  color: #6b7280;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 8px;
  border-radius: 12px;
  min-width: 40px;
  height: 20px;
  transition: all 0.3s ease;
  justify-content: center;
}
.theme-site .indel-position-display .position-current {
  font-weight: 700;
  color: #10b981;
  font-size: 12px;
}
.theme-site .indel-position-display .position-separator {
  color: #9ca3af;
  margin: 0 3px;
  font-weight: 400;
  font-size: 10px;
}
.theme-site .indel-position-display .position-total {
  font-weight: 600;
  color: #6b7280;
  font-size: 11px;
}
.theme-site .indel-slider-wrapper md-slider .md-thumb {
  top: 17px;
}
.theme-site .indel-slider-wrapper md-slider .md-thumb:after {
  margin-left: -4px;
  margin-top: -4px;
}
@media (max-width: 600px) {
  .theme-site #search-container {
    display: block;
  }
}
.theme-site md-input-container.slide-out-hidden-input {
  margin-bottom: 0px;
  margin-top: 8px;
  margin-left: 8px;
  width: 170px;
}
.theme-site md-input-container.slide-out-hidden-input input {
  font-size: 16px;
  height: 26px;
}
.theme-site .sq-md-no-spacer .md-errors-spacer {
  display: none;
}
/**
 * This is the main sequencing form stylesheet. It should include or import all
 * stylesheets used throughout the application relating to sequencing forms
 */
.header-buttons .btn:first-child {
  margin-left: 0px;
}
hr {
  color: #FFFFFF;
}
.queue.btn {
  width: 82px;
}
.email-choice .form-control {
  width: 100%;
}
.email-choice .form-control.ng-invalid {
  color: #a54243;
  border-color: #a54243;
}
.email-choice .form-control.ng-invalid:focus {
  border-color: #a54243;
  box-shadow: none;
  outline: 0 none;
}
.email-choice .email-footer {
  margin: 0 auto 20px;
  position: relative;
}
.email-choice .email-footer .error {
  left: 0;
  position: absolute;
  font-size: 12px;
  color: #a54243;
}
.form-content {
  text-align: center;
}
.uploader-parent {
  margin-top: 10px;
}
.submission-form-card {
  z-index: auto;
}
.submission-form-card md-tabs md-tabs-content-wrapper {
  width: 500px;
}
.submission-form-card md-tabs md-tabs-content-wrapper .hint {
  bottom: 0;
  clear: left;
  color: #333;
  font-size: 0.875rem;
  left: 0;
  padding-left: 16px;
  position: absolute;
  right: auto;
  transition: all 0.3s cubic-bezier(0.55, 0, 0.55, 0.2) 0s;
}
.submission-form-card md-list-item {
  margin-bottom: 10px;
}
.form-control {
  box-shadow: none;
  color: #212121;
  border-color: #212121;
}
#inner-form {
  border: 1px solid #212121;
  border-radius: 8px;
  padding: 20px;
  text-align: center;
}
.login > .login {
  display: table-cell;
  vertical-align: middle;
  width: 300px;
}
.container.login {
  display: table;
  height: 675px;
  width: 100%;
}
.narrow-form {
  width: 344px;
}
.narrow-form.no-border {
  border: 0px;
  padding: 0px;
}
.two-select {
  width: 398px;
}
.form {
  height: 500px;
  display: table;
  width: 100%;
  /*  min-height:410px;
  position:relative;
  margin-top:0px;*/
}
.form.fired-form {
  min-height: 0px;
  transition: all 0.15s;
}
.form.fired-form.ng-add {
  -webkit-animation: fadeIn 1s;
  -moz-animation: fadeIn 1s;
  -ms-animation: fadeIn 1s;
  animation: fadeIn 1s;
}
.form.fired-form.ng-remove-active {
  -webkit-animation: fadeOut 1s;
  -moz-animation: fadeOut 1s;
  -ms-animation: fadeOut 1s;
  animation: fadeOut 1s;
}
.form-header {
  margin-top: 29px;
}
.btn.reset {
  position: absolute;
  right: 60px;
  top: 10px;
}
.select2-container {
  width: 100px;
}
.modal-footer .error {
  float: left;
  color: #a54243;
}
#form-submission-buttons {
  margin-top: 25px;
}
embed {
  display: block;
  height: auto;
  width: 100%;
}
.annotation-complete img {
  height: 40px;
  margin-left: -5px;
  margin-right: -8px;
  margin-top: -9px;
}
.annotation-progress {
  font-style: italic;
}
.chosen-container {
  min-width: 176px;
}
.chosen-container:nth-of-type(2) {
  margin-left: 15px;
}
.chosen-container .chosen-drop {
  margin-top: -2px;
  width: 100%;
  border-width: 0px 1px 1px;
  border-style: none solid solid;
  border-color: #212121;
  border-image: none;
  background: #FFFFFF none repeat scroll 0% 0%;
  box-shadow: none;
}
.chosen-container.chosen-container-single .chosen-single {
  background: #FFFFFF;
  border: 1px solid #212121;
  border-radius: 8px;
  box-shadow: none;
  color: #212121;
  height: 23px;
  overflow: hidden;
  position: relative;
  text-decoration: none;
  white-space: nowrap;
  display: block;
  font-size: 16px;
  height: 35px;
  line-height: 1.5;
  padding: 6px 12px;
  transition: border-color 0.15s ease-in-out 0s;
  width: 100%;
}
.chosen-container.chosen-container-single .chosen-single div {
  display: block;
  height: 100%;
  position: absolute;
  right: 0;
  top: 6px;
  width: 18px;
}
.chosen-md-5 .chosen-container {
  width: 50%;
}
.chosen-md-6 .chosen-container {
  width: 60%;
}
.chosen-md-7 .chosen-container {
  width: 70%;
}
.chosen-md-8 .chosen-container {
  width: 80%;
}
.form-group {
  margin-bottoosem: 5px;
  padding-left: 0;
  display: block;
  margin: 20px auto;
}
.form-group:last-child {
  margin-bottom: 0px;
}
.form-group + .form-group {
  margin-top: 10px;
}
.narrow-form .form-group {
  width: 100%;
}
.form-group.col-xs-8 .chosen-container {
  max-width: 188px;
}
input[multiple] {
  width: 6.2em;
}
.sel-file {
  padding: 1px 5px;
  font-size: smaller;
  color: grey;
}
.response {
  padding-top: 30px;
}
.response > ul {
  list-style-type: decimal;
}
.response li,
.response .reqh {
  color: blue;
  font-size: smaller;
  padding-bottom: 5px;
}
.progress {
  border: 1px none;
  box-shadow: none !important;
  display: inline-block;
  height: auto;
  margin-bottom: -7px;
  padding: 0;
  width: 100px;
}
.progress div {
  background: none repeat scroll 0 0 #428bca;
  color: #FFFFFF;
  font-size: 16px;
  height: 32px;
  line-height: 32px;
  text-align: center;
  width: 0;
}
.drop-box {
  background: #F8F8F8;
  border: 5px dashed #DDD;
  width: 200px;
  height: 65px;
  text-align: center;
  padding-top: 35px;
}
.upload-info {
  margin-top: 10px;
}
.file-info.ng-binding {
  position: absolute;
  top: -7px;
  left: 0px;
  font-size: 11px;
}
.form-inline {
  position: relative;
}
.drop-box.dragover {
  border: 5px dashed blue;
}
/* for IE*/
.js-fileapi-wrapper {
  display: inline-block;
  vertical-align: middle;
}
button {
  padding: 1px 5px;
  font-size: smaller;
  margin: 0 3px;
}
.ng-v {
  float: right;
}
.sel-file img {
  float: left;
  width: 18px;
  height: 18px;
  padding-right: 10px;
}
.sub {
  font-size: smaller;
  color: #777;
  padding-top: 5px;
  padding-left: 10px;
}
.err {
  font-size: 12px;
  color: #C53F00;
  margin: 15px;
  padding: 15px;
  background-color: #F0F0F0;
  border: 1px solid black;
}
.queue-progress button:first-of-type {
  margin-left: 0;
}
.upload-file-name {
  display: block;
  max-width: 192px;
  overflow: hidden;
  word-wrap: break-word;
}
.option-parent:not(:last-of-type) {
  margin-bottom: 10px;
}
.option-parent .option-child:not(:last-child) {
  margin-bottom: 10px;
}
.option-stepchild {
  margin-left: 15px;
}
.option-stepchild h5 {
  display: inline-block;
  width: 100px;
}
.option-stepchild input {
  border: 1px solid #eee;
  border-radius: 8px;
  width: 100px;
  padding: 5px;
  margin-right: 15px;
}
.custom-autocomplete {
  margin-top: -18px;
  margin-bottom: -18px;
}
md-list-item.custom-list-item {
  padding-left: 1px;
  margin-bottom: -26px;
}
table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 20px;
  margin-bottom: 20px;
  border: 1px solid #212121;
}
thead {
  background-color: #36465d;
  color: #FFFFFF;
}
thead th {
  padding: 8px 15px;
  border-bottom: 2px solid #212121;
  font-weight: bold;
  text-align: left;
}
tbody tr.striped-row {
  background-color: rgba(0, 0, 0, 0.02);
}
tbody tr td {
  padding: 8px 15px;
  border-bottom: 1px solid #212121;
}
@media screen and (max-width: 1200px) {
  /*only apply below n width*/
  .btn.btn-warning.btn-xs {
    display: none;
  }
  .upload-file-name {
    max-width: 113px;
  }
  .annotation-progress {
    display: inline-block;
    margin-left: 0px;
    margin-top: 20px;
    text-align: center;
    width: 100%;
  }
}
input[type="checkbox"] + h5 {
  display: inline-block;
  margin-left: 5px;
}
@media screen and (max-width: 767px) {
  .annotation-result-buttons {
    margin: 8px 0px 12px 20px;
  }
  .form {
    height: 333.33333333px;
  }
}
@media screen and (max-width: 767px) {
  #result-choose-container .header-buttons {
    float: none;
    margin: 16px auto 0px;
    text-align: center;
    width: 129px;
    display: block;
  }
  #result-choose-container .inline-block {
    clear: both;
    display: block;
    text-align: center;
  }
  .btn.btn-warning.btn-s {
    display: none;
  }
}
.uploader-controls tr:first-child th {
  line-height: 1;
  padding-top: 0 !important;
}
.uploader-parent {
  margin-top: 10px;
}
.uploader-parent .file-upload {
  margin: 0px 0px 0 0;
  overflow: hidden;
  position: relative;
}
upload label.md-button {
  background-color: #FFFFFF;
  color: #212121;
}
.uploader-controls .upload-item-error {
  cursor: pointer;
  cursor: hand;
}
.uploader-controls .btn {
  margin-top: 10px;
}
.uploader-controls .btn.fa {
  font-size: 20px;
}
.uploader-controls th {
  font-size: 16px;
}
.uploader-controls td {
  padding: 0px;
  border-top: 0px!important;
}
.uploader-controls td > div,
.uploader-controls td > strong {
  padding: 5px;
  display: block;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0px;
}
.uploader-controls td > div.progress,
.uploader-controls td > strong.progress {
  padding: 0px!important;
}
.uploader-controls td > div .tooltip,
.uploader-controls td > strong .tooltip {
  padding: 10px;
}
.uploader-controls td .btn {
  margin-top: 0px;
}
input.upload {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  padding: 0;
  font-size: 20px;
  cursor: pointer;
  opacity: 0;
  filter: alpha(opacity=0);
  width: 100%;
  height: 100%;
  z-index: 999;
}
.uploader-controls {
  text-align: left;
}
.uploader-controls td {
  min-width: 82px!important;
}
.uploader-controls td,
.uploader-controls td *,
.uploader-controls th,
.uploader-controls th * {
  text-align: center;
}
.uploader-controls .progress {
  width: 200px !important;
}
.uploader-controls h3 {
  margin-top: 0px;
  line-height: 17px;
}
.uploader-controls th {
  font-size: 16px;
}
.uploader-controls > .btn {
  margin-top: 0px!important;
}
.uploader-controls *:last-child {
  margin-bottom: 0px;
  margin-right: 0px;
}
.uploader-controls button:last-child {
  margin-left: 0;
}
.uploader-controls th:last-child,
.uploader-controls td:last-child {
  padding-right: 0 !important;
}
.uploader-controls th:first-child,
.uploader-controls td:first-child {
  padding-left: 0 !important;
}
.uploader-controls .table {
  width: auto;
  margin: 0 auto!important;
}
.uploader-controls .table > thead > tr > th,
.uploader-controls .table > tbody > tr > th,
.uploader-controls .table > tfoot > tr > th,
.uploader-controls .table > thead > tr > td,
.uploader-controls .table > tbody > tr > td,
.uploader-controls .table > tfoot > tr > td {
  vertical-align: middle;
  padding: 10px;
}
.upload-exit-top div,
.upload-exit-top strong {
  height: 0px;
  padding: 0px;
  transform: translate(0px, -600px) scaley(0);
}
@keyframes exit_top {
  to {
    top: -500px;
  }
}
.animate-enter div,
.animate-leave div,
.animate-enter strong,
.animate-leave strong {
  transition: 4000ms cubic-bezier(0.95, 0.05, 0.795, 0.035) all;
  transition-delay: 2s;
  position: relative;
  display: block;
}
.animate-enter.animate-enter-active div,
.animate-leave div,
.animate-enter.animate-enter-active strong,
.animate-leave strong {
  opacity: 1;
  top: -500px;
  height: 30px;
  display: none;
}
.animate-leave.animate-leave-active div,
.animate-enter div,
.animate-leave.animate-leave-active strong,
.animate-enter strong {
  opacity: 0;
  top: 0;
  height: 0px;
}
@media screen and (max-width: 528px) {
  .uploader-controls tbody tr th:nth-child(n+4),
  .uploader-controls thead tr th:nth-child(n+4),
  .uploader-controls tbody tr td:nth-child(n+4),
  .uploader-controls thead tr td:nth-child(n+4) {
    display: none;
  }
  td div,
  td strong {
    max-width: 100%;
  }
}
@media screen and (min-width: 375px) and (max-width: 528px) {
  .uploader-controls td div,
  .uploader-controls td strong {
    max-width: 164px;
  }
}
@media screen and (min-width: 319px) and (max-width: 374px) {
  .uploader-controls td div,
  .uploader-controls td strong {
    max-width: 140px;
  }
}
/* Shared maintenance banner — keep in sync with chainlit/frontend/src/components/MaintenanceBanner.css */
maintenance-banner {
  display: block;
  width: 100%;
}
.maintenance-banner {
  position: relative;
  width: 100%;
  z-index: 1900;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 24px;
  min-height: 88px;
  padding: 24px 40px;
  box-sizing: border-box;
  overflow: hidden;
  font-family: 'Raleway', sans-serif;
  background: linear-gradient(135deg, #0f3259 0%, #123d73 48%, #1a508f 100%);
  color: #ffffff;
  border-bottom: 1px solid rgba(77, 179, 255, 0.28);
  box-shadow: 0 6px 22px rgba(18, 61, 115, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.maintenance-banner::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, #3d9ae8 0%, #7ec8ff 50%, #3d9ae8 100%);
}
.maintenance-banner__start {
  display: flex;
  align-items: center;
  gap: 20px;
  flex: 0 0 auto;
}
.maintenance-banner__end {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 0 0 auto;
}
.maintenance-banner__icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.14);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
  flex-shrink: 0;
}
.maintenance-banner-visible #navbar-container .navbar.navbar-fixed-top {
  position: relative;
  top: auto;
  right: auto;
  left: auto;
}
.maintenance-banner__icon,
.maintenance-banner__link-icon {
  color: inherit !important;
}
.maintenance-banner__icon-wrap md-icon,
.maintenance-banner__icon-wrap .material-icons {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.maintenance-banner__icon {
  font-size: 28px !important;
  width: 28px !important;
  height: 28px !important;
  line-height: 28px !important;
}
.maintenance-banner__link-icon {
  font-size: 18px !important;
  width: 18px !important;
  height: 18px !important;
  line-height: 18px !important;
}
.maintenance-banner__heading {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.maintenance-banner__message {
  min-width: 0;
  margin: 0;
  box-sizing: border-box;
  font-size: 15px;
  line-height: 1.5;
  text-align: center;
  color: rgba(255, 255, 255, 0.9);
}
.maintenance-banner__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 9px 16px;
  color: #e8f4ff;
  border: 1px solid rgba(126, 200, 255, 0.55);
  border-radius: 999px;
  background: rgba(77, 179, 255, 0.2);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  white-space: nowrap;
  text-decoration: none;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.maintenance-banner__link:hover {
  color: #ffffff;
  border-color: rgba(184, 226, 255, 0.75);
  background: rgba(77, 179, 255, 0.32);
}
.maintenance-banner__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: rgba(255, 255, 255, 0.75);
  cursor: pointer;
  font: inherit;
  line-height: 1;
  appearance: none;
  transition: background 0.15s ease, color 0.15s ease;
}
.maintenance-banner__close .material-icons,
.maintenance-banner__close md-icon {
  font-size: 24px !important;
  width: 24px !important;
  height: 24px !important;
  line-height: 24px !important;
}
.maintenance-banner__close:hover {
  background: rgba(255, 255, 255, 0.12);
  color: #ffffff;
}
.maintenance-status-page {
  position: relative;
  min-height: 100vh;
  padding: 88px 20px 64px;
  background: #ffffff;
  color: #18181b;
}
.maintenance-banner-visible .maintenance-status-page {
  padding-top: 88px;
}
body.maintenance-status-visible navbar,
body.maintenance-status-visible maintenance-banner {
  display: none !important;
}
body.maintenance-status-visible main {
  padding: 0 !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
}
.maintenance-status-page .back-arrow-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: absolute !important;
  top: 15px !important;
  left: 15px !important;
  z-index: 1000 !important;
  min-width: 48px !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  background-color: rgba(255, 255, 255, 0.9) !important;
  color: rgba(63, 81, 181, 0.9) !important;
  transition: all 0.3s ease !important;
  border: 1px solid rgba(63, 81, 181, 0.2) !important;
  opacity: 0;
  animation: fadeInLeft 2s cubic-bezier(0.23, 1, 0.32, 1) 0s forwards;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}
.maintenance-status-page .back-arrow-button:hover {
  background-color: #ffffff !important;
  color: #3f51b5 !important;
  transform: scale(1.05) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}
.maintenance-status-page .back-arrow-button md-icon {
  font-size: 24px !important;
  width: 24px !important;
  height: 24px !important;
  line-height: 24px !important;
}
@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translateX(-20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
.maintenance-status-card,
.maintenance-status-empty,
.maintenance-status-error,
.maintenance-status-loading {
  max-width: 980px;
  margin: 0 auto 26px;
}
.maintenance-status-card {
  overflow: hidden;
  border: 1px solid #e2e5eb;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}
.maintenance-status-card h2 {
  padding: 22px 26px;
  border-bottom: 1px solid #eef0f4;
  font-size: 22px;
  font-weight: 600;
}
.maintenance-status-card--primary {
  border-color: #2b74ff;
}
.maintenance-status-card__top {
  padding: 26px;
  background: #dbeafe;
}
.maintenance-status-card__top h1 {
  font-size: 24px;
  font-weight: 600;
}
.maintenance-status-card__meta {
  padding: 18px 26px;
  border-bottom: 1px solid #eef0f4;
  color: #6b7280;
  font-size: 17px;
}
.maintenance-status-card p {
  padding: 28px 26px 8px;
  margin: 0;
  color: #18181b;
  font-size: 18px;
  line-height: 1.55;
}
.maintenance-status-card__updated {
  padding: 12px 26px 26px;
  color: #6b7280;
  font-size: 16px;
}
.maintenance-status-component {
  padding: 22px 26px;
  border-bottom: 1px solid #eef0f4;
  font-size: 17px;
  font-weight: 600;
}
.maintenance-status-component:last-child {
  border-bottom: 0;
}
.maintenance-status-update {
  display: grid;
  grid-template-columns: 12px 1fr;
  gap: 18px;
  padding: 26px;
}
.maintenance-status-update + .maintenance-status-update {
  border-top: 1px solid #eef0f4;
}
.maintenance-status-update__dot {
  width: 9px;
  height: 9px;
  margin-top: 8px;
  border-radius: 50%;
  background: #ff6b6b;
}
.maintenance-status-update__dot--completed {
  background: #22c55e;
}
.maintenance-status-update__dot--under_maintenance {
  background: #f59e0b;
}
.maintenance-status-update__body h3 {
  margin-bottom: 14px;
  font-size: 20px;
  font-weight: 600;
}
.maintenance-status-update__body p {
  padding: 0 0 14px;
  font-size: 17px;
}
.maintenance-status-update__body div {
  color: #6b7280;
}
.maintenance-status-empty,
.maintenance-status-error,
.maintenance-status-loading {
  padding: 30px;
  text-align: center;
}
.maintenance-status-empty h1 {
  margin-bottom: 10px;
  font-size: 28px;
  font-weight: 600;
}
.maintenance-status-empty p,
.maintenance-status-error {
  color: #6b7280;
  font-size: 17px;
}
@media (max-width: 820px) {
  .maintenance-banner {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px 14px;
    padding: 18px 24px;
    min-height: 0;
  }
  .maintenance-banner__start {
    flex: 0 1 auto;
    min-width: 0;
  }
  .maintenance-banner__end {
    flex: 0 0 auto;
  }
  .maintenance-banner__icon-wrap {
    width: 40px;
    height: 40px;
  }
  .maintenance-banner__heading {
    white-space: normal;
  }
  .maintenance-banner__message {
    flex: 1 1 100%;
    order: 3;
    width: 100%;
    max-width: none;
    font-size: 14px;
    text-align: center;
  }
  .maintenance-banner__link {
    font-size: 14px;
    padding: 8px 14px;
  }
  .maintenance-status-page {
    padding-top: 76px;
  }
  .maintenance-banner-visible .maintenance-status-page {
    padding-top: 76px;
  }
}
/**
 * Navigation
 */
.theme-site .md-toolbar-tools {
  background: transparent;
  margin: 0px;
  padding: 20px;
  width: 100%;
}
.nav-progress {
  position: absolute;
  top: 0;
  left: 87%;
  z-index: 999;
}
@keyframes swing {
  15% {
    -webkit-transform: translateX(5px);
    transform: translateX(5px);
    color: #428bca;
  }
  30% {
    -webkit-transform: translateX(-5px);
    transform: translateX(-5px);
    color: #428bca;
  }
  50% {
    -webkit-transform: translateX(3px);
    transform: translateX(3px);
    color: #428bca;
  }
  65% {
    -webkit-transform: translateX(-3px);
    transform: translateX(-3px);
    color: #428bca;
  }
  80% {
    -webkit-transform: translateX(2px);
    transform: translateX(2px);
    color: #428bca;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    color: normal;
  }
}
@keyframes swing-shadow {
  0% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    box-shadow: 0 0 0 0px #428bca inset;
  }
  5% {
    -webkit-transform: translateX(5px);
    transform: translateX(0px);
    box-shadow: 0 0 0 0.5px #428bca inset;
  }
  10% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    box-shadow: 0 0 0 1px #428bca inset;
  }
  15% {
    -webkit-transform: translateX(5px);
    transform: translateX(5px);
    box-shadow: 0 0 0 1.5px #428bca inset;
  }
  20% {
    -webkit-transform: translateX(5px);
    transform: translateX(5px);
    box-shadow: 0 0 0 2px #428bca inset;
  }
  30% {
    -webkit-transform: translateX(-5px);
    transform: translateX(-5px);
    box-shadow: 0 0 0 2.5px #428bca inset;
  }
  50% {
    -webkit-transform: translateX(3px);
    transform: translateX(3px);
    box-shadow: 0 0 0 3px #428bca inset;
  }
  65% {
    -webkit-transform: translateX(-3px);
    transform: translateX(-3px);
    box-shadow: 0 0 0 2.5px #428bca inset;
  }
  80% {
    -webkit-transform: translateX(2px);
    transform: translateX(2px);
    box-shadow: 0 0 0 2px #428bca inset;
  }
  90% {
    -webkit-transform: translateX(2px);
    transform: translateX(2px);
    box-shadow: 0 0 0 1px #428bca inset;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    box-shadow: 0 0 0 0px #428bca inset;
  }
}
.nav-link.md-button {
  text-transform: none;
  min-width: 30px;
}
.nav-link.md-button.upper-case {
  text-transform: uppercase;
}
@keyframes sparkle-spin {
  0% {
    transform: rotate(0deg) scale(1);
  }
  25% {
    transform: rotate(15deg) scale(1.1);
  }
  50% {
    transform: rotate(0deg) scale(1);
  }
  75% {
    transform: rotate(-15deg) scale(1.1);
  }
  100% {
    transform: rotate(0deg) scale(1);
  }
}
.bystro-ai-link.md-button {
  font-weight: 600;
  transition: color 150ms ease;
}
.nav-docs-link.md-button,
.nav-docs-pill.md-button {
  font-weight: 500;
  color: #64748b;
  transition: color 150ms ease;
}
.nav-docs-link.md-button:hover,
.nav-docs-pill.md-button:hover {
  color: #1a1a2e;
}
.nav-pricing-link.md-button {
  font-weight: 600;
  color: #1f4b93;
  transition: color 150ms ease;
}
.nav-pricing-link.md-button:hover {
  color: #173a73;
}
.collapse {
  display: none;
}
.brand.navbar-brand .Aligner {
  margin-top: -3px;
}
.bystro-home-btn.md-button {
  height: 42px !important;
  min-width: 42px !important;
  width: 42px !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 20px !important;
  text-align: center !important;
  line-height: 42px !important;
}
.bystro-home-btn.md-button:after {
  display: none !important;
}
.active a {
  color: #428bca;
}
#navbar-container {
  overflow: visible;
}
#navbar-container ul {
  padding-left: 0px;
}
#navbar-container ul,
#navbar-container li {
  list-style-type: none;
}
#navbar-container a,
#navbar-container button {
  font-size: 17px;
}
#navbar-container a:hover {
  text-decoration: none;
}
#navbar-container .navbar-nav .name-display {
  max-width: 350px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
@media (min-width: 0px) and (max-width: 959px) and (orientation: portrait) {
  #navbar-container .md-toolbar-tools {
    height: 64px;
    max-height: 64px;
  }
}
@media (min-width: 0px) and (max-width: 959px) and (orientation: landscape) {
  #navbar-container .md-toolbar-tools {
    height: 64px;
    max-height: 64px;
  }
}
#navbar-container.navbar-fixed-parent.top {
  margin-bottom: 51px;
}
#navbar-container .navbar small {
  font-size: 60%;
}
#navbar-container .navbar a {
  cursor: pointer;
  cursor: hand;
}
#navbar-container .navbar a:focus {
  outline: 0;
}
@media screen and (min-width: 767px) {
  #navbar-container .navbar a {
    overflow: visible;
  }
  #navbar-container .navbar a:after {
    content: "";
    display: block;
    height: 1px;
    width: 0;
    background: #428bca;
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    margin-top: 2px;
    position: absolute;
    left: 8px;
    max-width: calc(100% - 16px);
    display: none;
  }
  #navbar-container .navbar a:hover:after {
    width: 100%;
  }
  #navbar-container .navbar a.active:after {
    width: 100%;
  }
}
#navbar-container .navbar a.active {
  color: #428bca;
}
#navbar-container .navbar a.active.md-fab,
#navbar-container .navbar a.active.site-button--colored {
  color: #FFFFFF;
}
#navbar-container .navbar a.new {
  animation: swing-shadow 1s ease;
  animation-iteration-count: 1;
}
#navbar-container .navbar a.new-swing {
  animation: swing 1s ease;
  animation-iteration-count: 1;
}
#navbar-container .navbar a > * {
  font-weight: inherit;
}
#navbar-container .navbar .navbar-brand {
  margin-right: 8px;
}
#navbar-container .navbar .navbar-brand a {
  border-radius: 50%;
  transition: 0.5s all;
}
#navbar-container .navbar .navbar-brand a.active {
  border-radius: 8px;
}
#navbar-container .navbar .navbar-brand a.active:after {
  border-bottom: 0px;
}
#navbar-container .navbar .nav-right-item {
  display: flex;
  align-items: center;
}
#navbar-container .navbar .nav-right-item a:after,
#navbar-container .navbar .nav-right-item a.md-button:after {
  display: none !important;
}
#navbar-container .navbar .nav-right-item .sign-up a,
#navbar-container .navbar .nav-right-item .sign-up a.md-button,
#navbar-container .navbar .nav-right-item .login a,
#navbar-container .navbar .nav-right-item .login a.md-button {
  font-weight: 600 !important;
}
#navbar-container .navbar .navbar-header #navbar-toggle-parent:focus {
  background: none;
}
#navbar-container .navbar .navbar-nav > li,
#navbar-container .navbar .navbar-header > li {
  font-size: 16px;
  position: relative;
}
#navbar-container .navbar .navbar-nav > li.brand,
#navbar-container .navbar .navbar-header > li.brand {
  margin-left: 0px;
}
#navbar-container .navbar .navbar-nav > li.brand a,
#navbar-container .navbar .navbar-header > li.brand a {
  font-size: 18px;
  display: inline-flex;
}
#navbar-container .navbar .navbar-nav > li.brand a .Aligner,
#navbar-container .navbar .navbar-header > li.brand a .Aligner {
  width: 100%;
}
#navbar-container .navbar .navbar-nav {
  padding-top: 0px;
  padding-bottom: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
}
#navbar-container .navbar .navbar-nav .notification-count {
  background-color: #428bca;
  border-radius: 8px;
  color: #FFFFFF;
  font-size: 9px;
  font-weight: 700;
  padding: 3px;
  position: absolute;
  left: 80%;
  top: -5px;
  white-space: nowrap;
  z-index: 999;
  line-height: 1;
}
#navbar-container .navbar .navbar-nav > li {
  float: none;
  vertical-align: middle !important;
  display: table-cell;
}
#navbar-container .navbar .navbar-nav > li a:hover {
  font-weight: inherit;
}
#navbar-container .navbar .navbar-nav.navbar-right {
  margin-right: 0px;
}
#navbar-container .navbar .navbar-nav.navbar-right * + * > a {
  margin-left: 10px;
}
#navbar-container .navbar .navbar-nav.navbar-right > li {
  clear: none;
  display: table-cell;
  float: none;
  vertical-align: middle;
}
#navbar-container .navbar .navbar-nav.navbar-right > li:first-child {
  padding-left: 0px;
}
#navbar-container .navbar .navbar-nav.navbar-right .settings {
  padding-left: 5px;
  padding-right: 5px;
}
#navbar-container .navbar .navbar-nav.navbar-right .spacer {
  height: 50px;
  padding: 0;
}
#navbar-container .navbar .navbar-nav .center.login-name {
  display: flex;
  margin-bottom: 0px;
  align-items: center;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v20/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v20/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuI6fMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v20/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuGKYMZg.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v20/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuFuYMZg.ttf) format('truetype');
}
#navbar-container .center.login-name {
  display: flex;
  margin-bottom: 3px;
  align-items: center;
}
@media screen and (max-width: 767px) {
  #navbar-container .center.login-name {
    left: 50%;
    position: absolute;
    top: 15px;
  }
  #navbar-container .center.login-name .name-display {
    position: relative;
    left: -50%;
    display: none;
  }
  #navbar-container .navbar-desktop {
    display: none !important;
  }
  #navbar-container .navbar-toggle-mobile {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    cursor: pointer;
    border-radius: 12px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    margin-left: auto;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border: none;
    box-shadow: 0 2px 8px rgba(102, 126, 234, 0.3);
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  #navbar-container .navbar-toggle-mobile:hover,
  #navbar-container .navbar-toggle-mobile:active {
    transform: scale(0.96);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
  }
  #navbar-container .navbar-toggle-mobile md-icon {
    font-size: 24px;
    color: #ffffff;
    transition: transform 0.2s ease;
  }
  #navbar-container .navbar-mobile {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    height: 100dvh;
    z-index: 9998;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease;
    pointer-events: none;
    display: block !important;
  }
  #navbar-container .navbar-mobile.navbar-mobile--open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
  #navbar-container .navbar-mobile.navbar-mobile--open .mobile-nav-panel {
    transform: translateX(0);
  }
  #navbar-container .navbar-mobile .mobile-nav-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 9999;
    touch-action: manipulation;
  }
  #navbar-container .navbar-mobile .mobile-nav-panel {
    position: absolute;
    top: 0;
    right: 0;
    width: 320px;
    max-width: 85vw;
    height: 100%;
    height: 100dvh;
    background: #ffffff;
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.32, 0.72, 0, 1);
    display: flex;
    flex-direction: column;
    z-index: 10002;
    box-shadow: -8px 0 32px rgba(0, 0, 0, 0.15);
    overflow: hidden;
  }
  #navbar-container .navbar-mobile .mobile-nav-header {
    padding: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    flex-shrink: 0;
  }
  #navbar-container .navbar-mobile .mobile-nav-header .mobile-nav-logo {
    display: flex;
    align-items: center;
    gap: 12px;
  }
  #navbar-container .navbar-mobile .mobile-nav-header .mobile-nav-logo .link.md-button.site-button--colored {
    margin-left: 0px;
    border-radius: 50%;
    height: 40px;
    width: 40px;
    line-height: 40px;
    text-align: center;
    padding-left: 10px;
  }
  #navbar-container .navbar-mobile .mobile-nav-header .mobile-nav-logo md-button {
    height: 36px !important;
    min-width: 36px !important;
    width: 36px !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    margin: 0 !important;
    background: rgba(255, 255, 255, 0.2) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
  }
  #navbar-container .navbar-mobile .mobile-nav-header .mobile-nav-logo .mobile-nav-title {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: -0.3px;
  }
  #navbar-container .navbar-mobile .mobile-nav-header .mobile-nav-close {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    transition: all 0.2s ease;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  #navbar-container .navbar-mobile .mobile-nav-header .mobile-nav-close:hover,
  #navbar-container .navbar-mobile .mobile-nav-header .mobile-nav-close:active {
    background: rgba(255, 255, 255, 0.25);
  }
  #navbar-container .navbar-mobile .mobile-nav-header .mobile-nav-close md-icon {
    font-size: 22px !important;
    color: #ffffff !important;
    opacity: 1 !important;
    line-height: 26px !important;
    padding-left: 1px !important;
  }
  #navbar-container .navbar-mobile .mobile-nav-content {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 8px 0 24px 0;
    background: #f8fafc;
    -webkit-overflow-scrolling: touch;
  }
  #navbar-container .navbar-mobile .mobile-nav-content::-webkit-scrollbar {
    width: 0;
  }
  #navbar-container .navbar-mobile .mobile-nav-section {
    margin: 0;
    padding: 0;
  }
  #navbar-container .navbar-mobile .mobile-nav-section .mobile-nav-section-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 20px;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    background: #f1f5f9;
    cursor: pointer;
    transition: background 0.2s ease;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  #navbar-container .navbar-mobile .mobile-nav-section .mobile-nav-section-header:active {
    background: #e2e8f0;
  }
  #navbar-container .navbar-mobile .mobile-nav-section .mobile-nav-section-header md-icon {
    font-size: 18px;
    width: 18px;
    height: 18px;
    min-width: 18px;
    min-height: 18px;
    color: #64748b;
  }
  #navbar-container .navbar-mobile .mobile-nav-section .mobile-nav-section-header .section-arrow {
    margin-left: auto;
    transition: transform 0.25s ease;
  }
  #navbar-container .navbar-mobile .mobile-nav-section .mobile-nav-section-header .section-arrow.rotated {
    transform: rotate(180deg);
  }
  #navbar-container .navbar-mobile .mobile-nav-subsection {
    padding: 4px 0;
    background: #ffffff;
    margin: 8px 12px;
    border-radius: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  }
  #navbar-container .navbar-mobile .mobile-nav-subsection .mobile-nav-subsection-title {
    padding: 14px 16px 8px 16px;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 11px;
    font-weight: 700;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 1px;
  }
  #navbar-container .navbar-mobile .mobile-nav-item {
    display: block !important;
    text-decoration: none !important;
    color: inherit !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    cursor: pointer !important;
    min-height: auto !important;
    height: auto !important;
    line-height: normal !important;
    padding: 0 !important;
    text-transform: none !important;
    font-weight: normal !important;
    box-shadow: none !important;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  #navbar-container .navbar-mobile .mobile-nav-item:hover,
  #navbar-container .navbar-mobile .mobile-nav-item:focus {
    background-color: transparent !important;
  }
  #navbar-container .navbar-mobile .mobile-nav-item .mobile-nav-item-content {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    margin: 2px 8px;
    border-radius: 12px;
    position: relative;
    transition: all 0.15s ease;
  }
  #navbar-container .navbar-mobile .mobile-nav-item .mobile-nav-item-content:active {
    background: #f1f5f9;
    transform: scale(0.98);
  }
  #navbar-container .navbar-mobile .mobile-nav-item .mobile-nav-item-content md-icon {
    font-size: 22px;
    width: 22px;
    height: 22px;
    min-width: 22px;
    min-height: 22px;
    color: #667eea;
    flex-shrink: 0;
  }
  #navbar-container .navbar-mobile .mobile-nav-item .mobile-nav-item-content .mobile-nav-item-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
  }
  #navbar-container .navbar-mobile .mobile-nav-item .mobile-nav-item-content .mobile-nav-item-text .mobile-nav-item-title {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #1e293b;
    margin-bottom: 2px;
    letter-spacing: -0.2px;
  }
  #navbar-container .navbar-mobile .mobile-nav-item .mobile-nav-item-content .mobile-nav-item-text .mobile-nav-item-description {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 13px;
    color: #64748b;
    line-height: 1.4;
  }
  #navbar-container .navbar-mobile .mobile-nav-item .mobile-nav-item-content .mobile-notification-count {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 11px;
    font-weight: 700;
    padding: 4px 8px;
    border-radius: 20px;
    min-width: 20px;
    text-align: center;
    margin-left: auto;
  }
  #navbar-container .navbar-mobile .mobile-nav-item .mobile-nav-item-content .mobile-notification-badge {
    background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
    color: white;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 10px;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 20px;
    margin-left: auto;
    text-transform: uppercase;
    letter-spacing: 0.5px;
  }
  #navbar-container .navbar-mobile .mobile-nav-item.active .mobile-nav-item-content {
    background: rgba(102, 126, 234, 0.08);
  }
  #navbar-container .navbar-mobile .mobile-nav-item.active .mobile-nav-item-content md-icon {
    color: #667eea;
  }
  #navbar-container .navbar-mobile .mobile-nav-item.active .mobile-nav-item-content .mobile-nav-item-title {
    color: #667eea;
  }
  #navbar-container .navbar-mobile .mobile-nav-item.mobile-signup {
    margin: 12px 12px 4px 12px !important;
  }
  #navbar-container .navbar-mobile .mobile-nav-item.mobile-signup .mobile-nav-item-content {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    margin: 0;
    padding: 16px 20px;
    border-radius: 14px;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
  }
  #navbar-container .navbar-mobile .mobile-nav-item.mobile-signup .mobile-nav-item-content:active {
    transform: scale(0.98);
    box-shadow: 0 2px 8px rgba(102, 126, 234, 0.4);
  }
  #navbar-container .navbar-mobile .mobile-nav-item.mobile-signup .mobile-nav-item-content md-icon {
    color: #ffffff;
  }
  #navbar-container .navbar-mobile .mobile-nav-item.mobile-signup .mobile-nav-item-content .mobile-nav-item-text .mobile-nav-item-title {
    color: #ffffff;
    font-weight: 700;
  }
  #navbar-container .navbar-mobile .mobile-nav-item.mobile-signup .mobile-nav-item-content .mobile-nav-item-text .mobile-nav-item-description {
    color: rgba(255, 255, 255, 0.85);
  }
  #navbar-container .navbar-mobile .mobile-nav-item.mobile-logout {
    margin-top: 8px;
    border-top: 1px solid #f1f5f9;
    padding-top: 8px !important;
  }
  #navbar-container .navbar-mobile .mobile-nav-item.mobile-logout .mobile-nav-item-content md-icon {
    color: #ef4444;
  }
  #navbar-container .navbar-mobile .mobile-nav-item.mobile-logout .mobile-nav-item-content .mobile-nav-item-text .mobile-nav-item-title {
    color: #ef4444;
  }
  #navbar-container .navbar-mobile .mobile-nav-item.mobile-logout .mobile-nav-item-content .mobile-nav-item-text .mobile-nav-item-description {
    color: #f87171;
  }
  #navbar-container .navbar-mobile .mobile-nav-item.mobile-logout .mobile-nav-item-content:active {
    background: #fef2f2;
  }
  #navbar-container .navbar-mobile .mobile-nav-logged-in,
  #navbar-container .navbar-mobile .mobile-nav-logged-out {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  #navbar-container .md-toolbar-tools {
    padding: 12px 16px !important;
    height: 64px !important;
    max-height: 64px !important;
    margin-top: 0 !important;
  }
  #navbar-container .navbar-brand .bystro-home-btn.md-button {
    height: 40px !important;
    min-width: 40px !important;
    width: 40px !important;
    border-radius: 12px !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    padding: 0 !important;
  }
}
@media screen and (min-width: 768px) {
  #navbar-container .navbar-toggle-mobile,
  #navbar-container .navbar-mobile {
    display: none !important;
  }
  #navbar-container .navbar-desktop {
    display: flex !important;
    align-items: center;
    width: 100%;
  }
}
body.operator-active {
  background: #eef0f3;
}
body.operator-active md-toolbar.navbar,
body.operator-active md-toolbar.navbar.navbar-fixed-top,
body.operator-active .navbar.navbar-fixed-top {
  background: #eef0f3 !important;
  background-color: #eef0f3 !important;
  box-shadow: none !important;
  border-bottom: 1px solid rgba(174, 184, 197, 0.35);
  transition: none !important;
}
body.operator-active md-toolbar.navbar .md-toolbar-tools,
body.operator-active md-toolbar.navbar.navbar-fixed-top .md-toolbar-tools {
  background: transparent !important;
  background-color: transparent !important;
  transition: none !important;
}
.op-page {
  background: linear-gradient(180deg, #dde2e9 0, #eef0f3 132px, #f7f8fa 560px), #eef0f3;
  min-height: 100vh;
  padding: 32px 24px 44px;
}
.op-header {
  align-items: center;
  border-bottom: 1px solid #cfd6df;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  margin: 0 auto 22px;
  max-width: 1180px;
  padding: 0 0 18px;
  position: relative;
  width: 100%;
}
.op-header:before {
  background: #2f3742;
  border-radius: 999px;
  bottom: -2px;
  content: '';
  height: 3px;
  left: 0;
  position: absolute;
  width: 72px;
}
.op-header .md-button.md-icon-button {
  color: #2f6fbd;
}
.op-header-actions {
  align-items: center;
  display: flex;
  gap: 12px;
}
.op-total {
  background: rgba(251, 252, 253, 0.72);
  border: 1px solid #cfd6df;
  border-radius: 999px;
  color: #2f3742;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  padding: 8px 12px;
  white-space: nowrap;
}
.op-title {
  color: #161b22;
  font-size: 32px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.15;
  margin: 0;
}
.op-subtitle {
  color: #667384;
  font-size: 14px;
  margin: 5px 0 0;
}
.op-toolbar {
  align-items: flex-end;
  background: rgba(251, 252, 253, 0.92);
  border: 1px solid rgba(174, 184, 197, 0.75);
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(51, 65, 85, 0.05);
  box-sizing: border-box;
  column-gap: 20px;
  display: grid;
  grid-template-columns: minmax(320px, 560px) auto minmax(16px, 1fr) auto;
  margin: 0 auto 16px;
  max-width: 1180px;
  padding: 14px 16px;
  row-gap: 12px;
  width: 100%;
  padding-right: 0px;
}
.op-filter-checkbox {
  align-self: flex-end;
  box-sizing: border-box;
  color: #161b22;
  height: 42px;
  line-height: 42px;
  margin: 0;
  min-height: 42px;
  white-space: nowrap;
}
.op-filter-checkbox .md-label {
  color: #161b22;
  font-size: 14px;
  line-height: 42px;
  margin-bottom: 0;
  margin-left: 34px;
  margin-top: 0;
  vertical-align: top;
}
.op-page-size-label {
  color: #4f5b6b;
  display: flex;
  flex-direction: column;
  font-size: 12px;
  font-weight: 600;
  gap: 6px;
  margin-left: auto;
  min-width: 88px;
}
.op-search-label > span,
.op-page-size-label > span {
  line-height: 16px;
}
.op-page-size {
  background: #fff;
  border: 1px solid #aeb8c5;
  border-radius: 6px;
  box-sizing: border-box;
  color: #161b22;
  font-family: inherit;
  font-size: 14px;
  height: 42px;
  line-height: 40px;
  min-width: 88px;
  padding: 0 10px;
}
.op-search-label {
  color: #4f5b6b;
  display: flex;
  flex-direction: column;
  font-size: 12px;
  font-weight: 600;
  gap: 6px;
  max-width: 560px;
  min-width: 280px;
  width: 100%;
}
.op-search-control {
  align-items: center;
  background: #fff;
  border: 1px solid #aeb8c5;
  border-radius: 6px;
  box-sizing: border-box;
  display: flex;
  height: 42px;
  transition: border-color 120ms ease, box-shadow 120ms ease;
}
.op-search-control md-icon {
  color: #788596;
  flex: 0 0 20px;
  font-size: 20px;
  height: 20px;
  line-height: 20px;
  margin-left: 12px;
  width: 20px;
}
.op-search {
  background: transparent;
  border: 0;
  color: #161b22;
  flex: 1;
  font-family: inherit;
  font-size: 14px;
  height: 100%;
  line-height: 42px;
  min-width: 0;
  padding: 0 12px 0 8px;
}
.op-search::placeholder {
  color: #8792a0;
}
.op-search:focus {
  outline: none;
}
.op-search-control:focus-within {
  border-color: #2f6fbd;
  box-shadow: 0 0 0 2px rgba(47, 111, 189, 0.16);
}
.op-page-size:focus {
  border-color: #2f6fbd;
  box-shadow: 0 0 0 2px rgba(47, 111, 189, 0.16);
  outline: none;
}
.op-alert {
  border-radius: 6px;
  font-size: 13px;
  margin: 0 auto 12px;
  max-width: 1180px;
  padding: 10px 12px;
}
.op-alert--error {
  background: #fff1f1;
  border: 1px solid #f2b8b8;
  color: #8f1d1d;
}
.op-alert--success {
  background: #effaf4;
  border: 1px solid #a8ddb9;
  color: #1f6b3f;
}
.op-table-wrap {
  background: #fbfcfd;
  border: 1px solid #cfd6df;
  border-radius: 8px;
  box-sizing: border-box;
  box-shadow: 0 18px 42px rgba(51, 65, 85, 0.08);
  margin: 0 auto;
  max-width: 1180px;
  overflow-x: auto;
  width: 100%;
}
.op-table {
  border: 0;
  border-collapse: collapse;
  color: #161b22;
  font-size: 13px;
  margin: 0;
  width: 100%;
}
.op-table thead {
  background: #dfe4eb;
  color: #394555;
}
.op-table th,
.op-table td {
  border-bottom: 1px solid #dfe5ec;
  padding: 12px 14px;
  text-align: left;
  white-space: nowrap;
}
.op-table tbody tr {
  background: #fbfcfd;
}
.op-table tbody tr:hover {
  background: #f4f6f8;
}
.op-table th {
  color: #394555;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}
.op-sort-button {
  align-items: center;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  gap: 4px;
  letter-spacing: 0;
  margin: 0;
  padding: 0;
  text-transform: inherit;
  white-space: nowrap;
}
.op-sort-button md-icon {
  color: #667384;
  font-size: 15px;
  height: 15px;
  line-height: 15px;
  width: 15px;
}
.op-sort-button--active,
.op-sort-button--active md-icon {
  color: #2f6fbd;
}
.op-sort-button:focus {
  outline: 2px solid rgba(47, 111, 189, 0.34);
  outline-offset: 3px;
}
.op-table tbody tr:last-child td {
  border-bottom: 0;
}
.op-role,
.op-status {
  background: #e3e8ef;
  border: 1px solid #d2dae5;
  border-radius: 999px;
  color: #405066;
  display: inline-flex;
  font-size: 12px;
  line-height: 1;
  padding: 5px 8px;
}
.op-role--admin {
  background: #dce7f3;
  border-color: #c7d7e9;
  color: #254663;
}
.op-status--inactive {
  background: #f8e5e5;
  border-color: #edc8c8;
  color: #8f2525;
}
.op-status--suspended {
  background: #f7ecd0;
  border-color: #e7d39e;
  color: #76511c;
}
.op-actions {
  min-width: 84px;
}
.op-action-button.md-button.md-icon-button {
  height: 32px;
  line-height: 32px;
  margin: 0;
  min-height: 32px;
  min-width: 32px;
  width: 32px;
}
.op-action-button md-icon {
  color: #4f5b6b;
  font-size: 18px;
}
.op-action-empty {
  color: #8b98aa;
}
.op-state {
  align-items: center;
  color: #667384;
  display: flex;
  flex-direction: column;
  gap: 8px;
  justify-content: center;
  min-height: 220px;
}
.op-state md-icon {
  color: #647286;
}
.op-state h3 {
  color: #2f3a4a;
  font-size: 16px;
  font-weight: 600;
  margin: 0;
}
.op-state p {
  color: #667384;
  font-size: 13px;
  margin: 0;
  max-width: 420px;
  text-align: center;
}
.op-state code {
  background: #e7edf7;
  border: 1px solid #c4d1e4;
  border-radius: 4px;
  color: #26496f;
  font-size: 12px;
  padding: 3px 6px;
}
.op-pagination {
  align-items: center;
  box-sizing: border-box;
  color: #4f5b6b;
  display: flex;
  justify-content: space-between;
  margin: 12px auto 0;
  max-width: 1180px;
  width: 100%;
}
.op-prompt {
  margin-top: 16px;
  padding: 16px;
}
.op-prompt-header {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.op-prompt pre {
  background: #eef2f6;
  border: 1px solid #cfd6df;
  border-radius: 6px;
  color: #161b22;
  overflow-x: auto;
  padding: 12px;
  white-space: pre-wrap;
}
.op-review {
  margin-top: 16px;
  overflow-x: visible;
  padding: 16px;
}
.op-review--loading {
  align-items: center;
  display: flex;
  justify-content: center;
  min-height: 72px;
}
.op-review-header {
  align-items: flex-start;
  border-bottom: 1px solid #cfd6df;
  display: flex;
  justify-content: space-between;
  margin-bottom: 14px;
  padding-bottom: 12px;
}
.op-review-header h2 {
  color: #161b22;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.25;
  margin: 0;
}
.op-review-header p {
  color: #667384;
  font-size: 13px;
  margin: 4px 0 0;
}
.op-review-actions {
  align-items: center;
  display: flex;
  gap: 4px;
}
.op-review-actions .md-button.md-icon-button {
  height: 34px;
  line-height: 34px;
  margin: 0;
  min-height: 34px;
  min-width: 34px;
  width: 34px;
}
.op-review-summary {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-bottom: 12px;
}
.op-review-summary > div {
  background: #f4f6f8;
  border: 1px solid #cfd6df;
  border-radius: 6px;
  box-sizing: border-box;
  min-width: 0;
  padding: 10px 12px;
}
.op-review-summary span {
  color: #667384;
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: uppercase;
}
.op-review-summary strong {
  color: #161b22;
  display: block;
  font-size: 17px;
  line-height: 1.25;
  margin-top: 4px;
  overflow-wrap: anywhere;
}
.op-review-alert {
  margin-bottom: 14px;
}
.op-review-section {
  margin-top: 16px;
}
.op-review-section h3 {
  color: #2f3a4a;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.25;
  margin: 0 0 8px;
}
.op-review-table {
  border: 1px solid #cfd6df;
  border-collapse: collapse;
  color: #161b22;
  font-size: 12px;
  table-layout: fixed;
  width: 100%;
}
.op-review-table th,
.op-review-table td {
  border-bottom: 1px solid #dfe5ec;
  padding: 10px;
  text-align: left;
  vertical-align: top;
}
.op-review-table th {
  background: #dfe4eb;
  color: #394555;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}
.op-review-table pre {
  background: #eef2f6;
  border: 1px solid #cfd6df;
  border-radius: 6px;
  box-sizing: border-box;
  color: #161b22;
  font-family: inherit;
  line-height: 1.45;
  margin: 0;
  max-height: 180px;
  overflow: auto;
  padding: 10px;
  white-space: pre-wrap;
  word-break: break-word;
}
.op-review-empty {
  background: #f4f6f8;
  border: 1px dashed #aeb8c5;
  border-radius: 6px;
  color: #667384;
  font-size: 13px;
  padding: 12px;
}
@media (max-width: 720px) {
  .op-page {
    padding: 24px 16px 34px;
  }
  .op-toolbar {
    align-items: stretch;
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .op-filter-checkbox {
    margin: 0;
  }
  .op-page-size-label {
    margin-left: 0;
    width: 100%;
  }
  .op-page-size {
    width: 100%;
  }
  .op-search-label {
    max-width: none;
    min-width: 0;
  }
  .op-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }
  .op-review-header {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
  }
  .op-review-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@keyframes pricingFadeUp {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes pricingPulse {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
}
body.pricing-active md-toolbar.navbar,
body.pricing-active md-toolbar.navbar.navbar-fixed-top,
body.pricing-active .navbar.navbar-fixed-top {
  background: #f8fafc !important;
  background-color: #f8fafc !important;
  box-shadow: none !important;
  border-bottom: 1px solid transparent;
  transition: none !important;
}
body.pricing-active md-toolbar.navbar .md-toolbar-tools,
body.pricing-active md-toolbar.navbar.navbar-fixed-top .md-toolbar-tools {
  background: transparent !important;
  background-color: transparent !important;
  transition: none !important;
}
.pricing-page {
  background: #f8fafc;
  color: #0f172a;
  font-family: "Raleway", "Helvetica Neue", sans-serif;
  padding-bottom: 96px;
  -webkit-font-smoothing: antialiased;
}
.pricing-backdrop {
  display: none;
}
.pricing-hero {
  padding: 48px 24px 40px;
}
.pricing-hero-inner {
  max-width: 680px;
  margin: 0 auto;
  text-align: center;
}
.pricing-eyebrow,
.pricing-hero-title,
.pricing-hero-subtitle,
.pricing-hero-pills,
.pricing-status-line {
  opacity: 0;
  animation: pricingFadeUp 0.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
.pricing-eyebrow {
  margin: 0 0 12px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #2563eb;
  animation-delay: 0.05s;
}
.pricing-hero-title {
  margin: 0 0 20px;
  font-size: clamp(2rem, 4.5vw, 3.25rem);
  line-height: 1.05;
  letter-spacing: -0.03em;
  font-weight: 700;
  color: #0f172a;
  animation-delay: 0.05s;
}
.pricing-hero-subtitle {
  max-width: 540px;
  margin: 16px auto 0;
  font-size: clamp(1rem, 1.5vw, 1.125rem);
  line-height: 1.6;
  font-weight: 400;
  color: #334155;
  animation-delay: 0.15s;
}
.pricing-hero-pills {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 24px auto 0;
  animation-delay: 0.2s;
}
.pricing-hero-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 32px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #334155;
  font-size: 13px;
  font-weight: 500;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}
.pricing-hero-pill-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #2563eb;
  flex-shrink: 0;
}
.pricing-hero-pill--genetics .pricing-hero-pill-dot {
  background: #22a352;
}
.pricing-hero-pill--stats .pricing-hero-pill-dot {
  background: #d97706;
}
.pricing-hero-pill--research .pricing-hero-pill-dot {
  background: #6366f1;
}
.pricing-hero-note {
  margin: 0;
  font-size: 13px;
  color: #64748b;
}
.pricing-content {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 48px;
}
.pricing-section {
  margin-top: 72px;
}
.pricing-section--apex {
  margin-top: 72px;
}
.pricing-section-heading {
  max-width: 640px;
  margin: 0 0 20px;
}
.pricing-section-heading--compact {
  max-width: 560px;
}
.pricing-section-eyebrow {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #2563eb;
}
.pricing-section-title {
  margin: 0;
  font-size: clamp(1.375rem, 2.5vw, 1.875rem);
  line-height: 1.2;
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #0f172a;
}
.pricing-section-copy {
  margin: 8px 0 0;
  font-size: 1rem;
  line-height: 1.6;
  color: #334155;
}
.pricing-section-controls {
  display: flex;
  justify-content: center;
  margin: -2px 0 26px;
}
.pricing-intervals {
  display: flex;
  justify-content: center;
}
.pricing-segment {
  display: inline-flex;
  gap: 0;
  padding: 4px;
  border-radius: 22px;
  border: 1px solid #e2e8f0;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}
.pricing-interval-btn {
  min-width: 96px;
  height: 34px;
  padding: 0 22px;
  border: none;
  border-radius: 18px;
  cursor: pointer;
  background: transparent;
  color: #64748b;
  font-size: 14px;
  font-weight: 500;
  font-family: inherit;
  outline: none;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
  position: relative;
  z-index: 0;
}
.pricing-interval-btn.is-active {
  background: #0f172a;
  color: #fff;
  font-weight: 600;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
  z-index: 1;
}
.pricing-interval-btn:focus {
  outline: none;
}
.pricing-interval-btn:not(.is-active):hover {
  color: #0f172a;
  background: #f1f5f9;
}
.pricing-interval-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.pricing-status-line {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  margin: 20px auto 0;
  padding: 8px 16px;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #f9fafb;
  color: #0f172a;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
  animation-delay: 0.3s;
}
.pricing-status-line--loading {
  color: #64748b;
}
.pricing-status-line-loading {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.pricing-status-line-loading-dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #64748b;
  animation: pricingPulse 1.3s ease-in-out infinite;
}
.pricing-status-line-loading-dot:nth-child(2) {
  animation-delay: 0.12s;
}
.pricing-status-line-loading-dot:nth-child(3) {
  animation-delay: 0.24s;
}
.pricing-page-error,
.pricing-cancelled-notice,
.pricing-trial-notice {
  border-radius: 14px;
  padding: 16px 20px;
  margin: 0 0 20px;
  font-size: 14px;
  line-height: 1.6;
}
.pricing-page-error {
  color: #991b1b;
  background: #fef2f2;
  border: 1px solid #fecaca;
}
.pricing-cancelled-notice {
  color: #92400e;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.pricing-trial-notice {
  color: #1e3a8a;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
}
.pricing-cancelled-notice a,
.pricing-trial-notice a {
  color: #2563eb;
  text-decoration: none;
}
.pricing-cancelled-notice a:hover,
.pricing-trial-notice a:hover {
  text-decoration: underline;
}
.pricing-billing-notice {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  max-width: 100%;
  text-align: left;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.pricing-billing-notice__lead {
  margin: 0;
  line-height: 1.5;
}
.pricing-billing-notice__meta,
.pricing-billing-notice__action {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
}
.pricing-scheduled-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 22px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid #dbeafe;
  background: #eff6ff;
  color: #0f172a;
}
.pricing-scheduled-strip__copy {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  font-size: 13px;
  line-height: 1.45;
}
.pricing-scheduled-strip__copy strong {
  display: block;
  font-weight: 700;
  color: #0f172a;
}
.pricing-scheduled-strip__copy span {
  color: #334155;
}
.pricing-scheduled-strip__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2563eb;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.12);
  flex-shrink: 0;
}
.pricing-scheduled-strip__actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.pricing-scheduled-strip__button {
  min-height: 34px;
  padding: 0 12px;
  border-radius: 8px;
  border: 1px solid #bfdbfe;
  background: #fff;
  color: #2563eb;
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
}
.pricing-scheduled-strip__button:hover:not(:disabled),
.pricing-scheduled-strip__button:focus:not(:disabled) {
  border-color: #93c5fd;
  background: #f8fafc;
}
.pricing-scheduled-strip__button--primary {
  border-color: #2563eb;
  background: #2563eb;
  color: #fff;
}
.pricing-scheduled-strip__button--primary:hover:not(:disabled),
.pricing-scheduled-strip__button--primary:focus:not(:disabled) {
  border-color: #1d4ed8;
  background: #1d4ed8;
}
.pricing-scheduled-strip__button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.pricing-policy {
  margin-top: 48px;
}
.pricing-policy-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.pricing-policy-card {
  padding: 18px 20px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #fff;
}
.pricing-policy-card-title {
  margin: 0 0 6px;
  font-size: 14px;
  font-weight: 600;
  color: #0f172a;
}
.pricing-policy-card-copy {
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
  color: #334155;
}
.pricing-grid {
  display: grid;
  gap: 20px;
}
.pricing-grid--primary {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  justify-content: unset;
}
.pricing-grid--business {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.pricing-plan-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 28px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  box-sizing: border-box;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.pricing-grid--primary .pricing-plan-card {
  min-height: 580px;
}
.pricing-plan-card:hover {
  border-color: #cbd5e1;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06), 0 1px 4px rgba(0, 0, 0, 0.04);
  transform: translateY(-2px);
}
.pricing-plan-card--featured {
  border-color: transparent;
  background: #0f172a;
  box-shadow: 0 4px 24px rgba(15, 23, 42, 0.18), 0 1px 4px rgba(0, 0, 0, 0.06);
}
.pricing-plan-card--featured .pricing-plan-name {
  color: #fff;
}
.pricing-plan-card--featured .pricing-plan-price,
.pricing-plan-card--featured .pricing-plan-price-main {
  color: #fff;
}
.pricing-plan-card--featured .pricing-plan-billing {
  color: #94a3b8;
}
.pricing-plan-card--featured .pricing-plan-section-title,
.pricing-plan-card--featured .pricing-plan-group-heading {
  color: #94a3b8;
}
.pricing-plan-card--featured .pricing-plan-feature-mark::before {
  border-color: #38bdf8;
}
.pricing-plan-card--featured .pricing-plan-savings-inline {
  color: #34d399;
}
.pricing-plan-card--featured .pricing-plan-price-struck {
  color: #94a3b8;
}
.pricing-plan-card--featured:hover {
  border-color: transparent;
  box-shadow: 0 8px 32px rgba(15, 23, 42, 0.24), 0 2px 8px rgba(0, 0, 0, 0.08);
  transform: translateY(-2px);
}
.pricing-plan-card--current {
  border-color: #2563eb;
  box-shadow: 0 0 0 1px #2563eb, 0 2px 12px rgba(37, 99, 235, 0.1);
}
.pricing-plan-card--current:hover {
  border-color: #2563eb;
}
.pricing-plan-card--recommended {
  border-color: #dbeafe;
  box-shadow: 0 1px 3px rgba(37, 99, 235, 0.08), 0 1px 2px rgba(15, 23, 42, 0.03);
}
.pricing-plan-card--recommended:hover {
  border-color: #bfdbfe;
}
.pricing-plan-card--scheduled {
  border-color: #fde68a;
  background: #fffdf7;
}
.pricing-plan-card--scheduled:hover {
  border-color: #fcd34d;
}
.pricing-plan-card--featured.pricing-plan-card--current {
  border-color: transparent;
  box-shadow: 0 4px 24px rgba(15, 23, 42, 0.18), 0 1px 4px rgba(0, 0, 0, 0.06);
}
.pricing-plan-card--featured.pricing-plan-card--current:hover {
  border-color: transparent;
  box-shadow: 0 8px 32px rgba(15, 23, 42, 0.24), 0 2px 8px rgba(0, 0, 0, 0.08);
}
.pricing-plan-card--apex {
  padding: 28px;
}
.pricing-plan-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  position: relative;
}
.pricing-plan-head-copy {
  min-width: 0;
}
.pricing-plan-subtitle-line {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-top: 4px;
}
.pricing-plan-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  min-height: 24px;
}
.pricing-plan-kicker {
  margin: 0 0 4px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #64748b;
}
.pricing-plan-name {
  margin: 0;
  font-size: clamp(1.25rem, 1.75vw, 1.5rem);
  line-height: 1.1;
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #0f172a;
}
.pricing-plan-persona {
  min-width: 0;
  margin: 0;
  font-size: 0.8rem;
  font-weight: 500;
  color: #64748b;
}
.pricing-plan-card--featured .pricing-plan-persona {
  color: #94a3b8;
}
.pricing-plan-scheduled-note {
  flex: 0 0 auto;
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
  text-align: right;
  white-space: nowrap;
  color: #92400e;
}
.pricing-plan-tag {
  display: inline-flex;
  align-items: center;
  height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #f1f5f9;
  color: #334155;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
}
.pricing-plan-tag--current {
  background: rgba(37, 99, 235, 0.1);
  color: #2563eb;
  border-color: rgba(37, 99, 235, 0.25);
}
.pricing-plan-tag--cancelled {
  background: #fffbeb;
  color: #92400e;
  border-color: #fde68a;
}
.pricing-plan-tag--pending {
  background: #f1f5f9;
  color: #334155;
  border-color: #e2e8f0;
}
.pricing-plan-tag--scheduled {
  background: #fffbeb;
  color: #92400e;
  border-color: #fde68a;
}
.pricing-plan-tag--featured {
  background: #eff6ff;
  color: #2563eb;
  border-color: #bfdbfe;
  font-weight: 700;
  padding: 0 10px;
}
.pricing-plan-tag--limited {
  background: rgba(217, 119, 6, 0.14);
  color: #b45309;
  border-color: rgba(217, 119, 6, 0.3);
  font-weight: 700;
  padding: 0 10px;
  animation: pricing-pulse-limited 2.4s ease-in-out infinite;
}
@keyframes pricing-pulse-limited {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.7;
  }
}
.pricing-plan-card--featured .pricing-plan-tag--current {
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.2);
}
.pricing-plan-card--featured .pricing-plan-tag--cancelled {
  background: rgba(217, 119, 6, 0.2);
  color: #fbbf24;
  border-color: rgba(217, 119, 6, 0.3);
}
.pricing-plan-card--featured .pricing-plan-tag--pending {
  background: rgba(255, 255, 255, 0.08);
  color: #94a3b8;
  border-color: rgba(255, 255, 255, 0.15);
}
.pricing-plan-summary {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 16px 0 0;
  min-height: 110px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid rgba(37, 99, 235, 0.14);
  background: rgba(37, 99, 235, 0.04);
  position: relative;
}
.pricing-plan-credits {
  margin: 16px 0 0;
  padding: 16px;
  border-radius: 12px;
  border: 1px solid rgba(37, 99, 235, 0.14);
  background: rgba(37, 99, 235, 0.04);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.pricing-plan-credits-amount {
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #0f172a;
  line-height: 1.2;
}
.pricing-plan-credits-unit {
  font-size: 12px;
  font-weight: 500;
  color: #64748b;
}
.pricing-plan-card--featured .pricing-plan-credits {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.05);
}
.pricing-plan-card--featured .pricing-plan-credits-amount {
  color: #f1f5f9;
}
.pricing-plan-card--featured .pricing-plan-credits-unit {
  color: #94a3b8;
}
.pricing-plan-summary-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #2563eb;
}
.pricing-plan-summary-line {
  display: flex;
  align-items: center;
  gap: 10px;
}
.pricing-plan-summary-main {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35em;
  font-size: 20px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: #0f172a;
}
.pricing-plan-verification {
  color: #14b8a6;
}
.pricing-plan-summary-help {
  flex: 0 0 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  width: 20px;
  height: 20px;
  padding: 0;
  border: 1px solid rgba(37, 99, 235, 0.2);
  border-radius: 50%;
  background: #fff;
  color: #2563eb;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}
.pricing-plan-summary-copy {
  font-size: 13px;
  line-height: 1.5;
  color: #334155;
}
.pricing-plan-card--featured .pricing-plan-summary {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.05);
}
.pricing-plan-card--featured .pricing-plan-summary-label {
  color: #38bdf8;
}
.pricing-plan-card--featured .pricing-plan-summary-main,
.pricing-plan-card--featured .pricing-plan-summary-copy {
  color: #f1f5f9;
}
.pricing-plan-card--featured .pricing-plan-summary-help {
  border-color: rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.08);
  color: #38bdf8;
}
.pricing-plan-price {
  margin-top: 18px;
  font-size: clamp(2rem, 2.75vw, 2.5rem);
  line-height: 1;
  letter-spacing: -0.03em;
  font-weight: 700;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
  position: relative;
}
.pricing-plan-price-struck {
  display: inline-block;
  margin-right: 8px;
  color: #64748b;
  font-size: 18px;
  font-weight: 400;
  text-decoration: line-through;
}
.pricing-plan-price-main {
  white-space: nowrap;
}
.pricing-plan-billing {
  margin-top: 4px;
  font-size: 0.875rem;
  color: #64748b;
}
.pricing-plan-savings-inline {
  color: #059669;
  font-weight: 600;
}
.pricing-plan-section {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid #e2e8f0;
  position: relative;
}
.pricing-plan-card--featured .pricing-plan-section {
  border-top-color: rgba(255, 255, 255, 0.1);
}
.pricing-plan-section-title {
  margin: 0 0 12px;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #64748b;
}
.pricing-plan-feature-group + .pricing-plan-feature-group {
  margin-top: 14px;
}
.pricing-plan-group-heading {
  margin: 0 0 6px;
  padding-left: 14px;
  position: relative;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
}
.pricing-plan-group-heading::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #64748b;
}
.pricing-plan-feature-group--genetics .pricing-plan-group-heading::before {
  background: #22a352;
}
.pricing-plan-feature-group--ai .pricing-plan-group-heading::before {
  background: #4f6fa8;
}
.pricing-plan-feature-group--storage .pricing-plan-group-heading::before {
  background: #8b9ab5;
}
.pricing-plan-card--featured .pricing-plan-group-heading {
  color: #94a3b8;
}
.pricing-plan-card--featured .pricing-plan-feature-group--genetics .pricing-plan-group-heading::before {
  background: #4dd97a;
}
.pricing-plan-card--featured .pricing-plan-feature-group--ai .pricing-plan-group-heading::before {
  background: #8eaee4;
}
.pricing-plan-card--featured .pricing-plan-feature-group--storage .pricing-plan-group-heading::before {
  background: #a8b8d4;
}
.pricing-footnote {
  margin: 24px 0 0;
  font-size: 0.75rem;
  line-height: 1.5;
  color: #64748b;
  text-align: center;
}
.pricing-plan-features {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 6px;
}
.pricing-plan-feature {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 0.9rem;
  line-height: 1.45;
  color: #334155;
}
.pricing-plan-card--featured .pricing-plan-feature {
  color: #f1f5f9;
}
.pricing-plan-feature--session {
  align-items: center;
}
.pricing-plan-session-line {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.pricing-plan-session-text {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35em;
  font-weight: 600;
  color: #0f172a;
}
.pricing-plan-session-help {
  flex: 0 0 auto;
}
.pricing-plan-card--featured .pricing-plan-feature-desc {
  color: #94a3b8;
}
.pricing-plan-card--featured .pricing-plan-session-text {
  color: #f1f5f9;
}
.pricing-plan-feature-bold {
  color: #0f172a;
  font-weight: 600;
}
.pricing-plan-feature-mark {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  margin-top: 2px;
  position: relative;
}
.pricing-plan-feature-mark::before {
  content: '';
  position: absolute;
  top: 1px;
  left: 5px;
  width: 5px;
  height: 9px;
  border-right: 2px solid #2563eb;
  border-bottom: 2px solid #2563eb;
  transform: rotate(45deg);
}
.pricing-plan-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  position: relative;
}
.pricing-plan-cta-wrap {
  margin-top: auto;
  padding-top: 20px;
  position: relative;
}
.pricing-plan-you-are-here {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 500;
  color: #64748b;
}
.pricing-plan-cta.md-button {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  margin: 0;
  padding: 0 20px;
  border-radius: 10px;
  border: 1px solid #2563eb;
  background: #2563eb !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.22), 0 2px 6px rgba(15, 23, 42, 0.08) !important;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.pricing-plan-cta.md-button:not([disabled]):hover,
.pricing-plan-cta.md-button:not([disabled]):focus,
.pricing-plan-cta.md-button:not([disabled]).md-focused {
  border-color: #1d4ed8;
  background: #1d4ed8 !important;
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.26), 0 3px 8px rgba(15, 23, 42, 0.12) !important;
  transform: translateY(-1px);
}
.pricing-plan-cta.md-button:not([disabled]):hover,
.pricing-plan-cta.md-button:not([disabled]):focus,
.pricing-plan-cta.md-button:not([disabled]).md-focused,
.pricing-plan-cta.md-button:not([disabled]):hover *,
.pricing-plan-cta.md-button:not([disabled]):focus *,
.pricing-plan-cta.md-button:not([disabled]).md-focused * {
  color: #fff !important;
}
.pricing-plan-cta.md-button:not([disabled]):active {
  background: #1e40af !important;
  color: #fff !important;
  box-shadow: 0 5px 12px rgba(37, 99, 235, 0.18), 0 2px 5px rgba(15, 23, 42, 0.1) !important;
  transform: translateY(0);
}
.pricing-plan-founders .pricing-plan-cta.md-button {
  border-color: #3b82f6;
  background: #3b82f6 !important;
  box-shadow: 0 8px 18px rgba(59, 130, 246, 0.24), 0 2px 6px rgba(15, 23, 42, 0.08) !important;
}
.pricing-plan-founders .pricing-plan-cta.md-button:not([disabled]):hover,
.pricing-plan-founders .pricing-plan-cta.md-button:not([disabled]):focus,
.pricing-plan-founders .pricing-plan-cta.md-button:not([disabled]).md-focused,
.pricing-plan-founders .pricing-plan-cta.md-button:not([disabled]):active {
  border-color: #2563eb;
  background: #2563eb !important;
  color: #fff !important;
}
.pricing-plan-pro .pricing-plan-cta.md-button {
  border-color: #2563eb;
  background: #2563eb !important;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.24), 0 2px 6px rgba(15, 23, 42, 0.08) !important;
}
.pricing-plan-pro .pricing-plan-cta.md-button:not([disabled]):hover,
.pricing-plan-pro .pricing-plan-cta.md-button:not([disabled]):focus,
.pricing-plan-pro .pricing-plan-cta.md-button:not([disabled]).md-focused,
.pricing-plan-pro .pricing-plan-cta.md-button:not([disabled]):active {
  border-color: #1d4ed8;
  background: #1d4ed8 !important;
  color: #fff !important;
}
.pricing-plan-phd .pricing-plan-cta.md-button {
  border-color: #1e40af;
  background: #1e40af !important;
  box-shadow: 0 8px 18px rgba(30, 64, 175, 0.24), 0 2px 6px rgba(15, 23, 42, 0.08) !important;
}
.pricing-plan-phd .pricing-plan-cta.md-button:not([disabled]):hover,
.pricing-plan-phd .pricing-plan-cta.md-button:not([disabled]):focus,
.pricing-plan-phd .pricing-plan-cta.md-button:not([disabled]).md-focused,
.pricing-plan-phd .pricing-plan-cta.md-button:not([disabled]):active {
  border-color: #1e3a8a;
  background: #1e3a8a !important;
  color: #fff !important;
}
.pricing-plan-apex .pricing-plan-cta.md-button {
  border-color: #1e3a8a;
  background: #1e3a8a !important;
  box-shadow: 0 8px 18px rgba(30, 58, 138, 0.28), 0 2px 6px rgba(15, 23, 42, 0.08) !important;
}
.pricing-plan-apex .pricing-plan-cta.md-button:not([disabled]):hover,
.pricing-plan-apex .pricing-plan-cta.md-button:not([disabled]):focus,
.pricing-plan-apex .pricing-plan-cta.md-button:not([disabled]).md-focused,
.pricing-plan-apex .pricing-plan-cta.md-button:not([disabled]):active {
  border-color: #172554;
  background: #172554 !important;
  color: #fff !important;
}
.pricing-plan-card--featured .pricing-plan-cta.md-button {
  border-color: #fff;
  background: #fff !important;
  color: #0f172a !important;
}
.pricing-plan-card--featured .pricing-plan-cta.md-button:not([disabled]):hover,
.pricing-plan-card--featured .pricing-plan-cta.md-button:not([disabled]):focus,
.pricing-plan-card--featured .pricing-plan-cta.md-button:not([disabled]).md-focused {
  background: #f1f5f9 !important;
  border-color: #f1f5f9;
  color: #0f172a !important;
}
.pricing-plan-card--featured .pricing-plan-cta.md-button:not([disabled]):hover,
.pricing-plan-card--featured .pricing-plan-cta.md-button:not([disabled]):focus,
.pricing-plan-card--featured .pricing-plan-cta.md-button:not([disabled]).md-focused,
.pricing-plan-card--featured .pricing-plan-cta.md-button:not([disabled]):hover *,
.pricing-plan-card--featured .pricing-plan-cta.md-button:not([disabled]):focus *,
.pricing-plan-card--featured .pricing-plan-cta.md-button:not([disabled]).md-focused * {
  color: #0f172a !important;
}
.pricing-plan-card--featured .pricing-plan-cta.md-button:not([disabled]):active {
  background: #e2e8f0 !important;
  border-color: #e2e8f0;
}
.pricing-plan-card--current .pricing-plan-cta--manage.md-button {
  border-color: #2563eb;
  background: #2563eb !important;
  color: #fff !important;
}
.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):hover,
.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):focus,
.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]).md-focused {
  background: #1d4ed8 !important;
  color: #fff !important;
}
.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):hover,
.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):focus,
.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]).md-focused,
.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):hover *,
.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):focus *,
.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]).md-focused * {
  color: #fff !important;
}
.pricing-plan-apex.pricing-plan-card--current .pricing-plan-cta--manage.md-button {
  border-color: #1e3a8a;
  background: #1e3a8a !important;
  box-shadow: 0 8px 18px rgba(30, 58, 138, 0.28), 0 2px 6px rgba(15, 23, 42, 0.08) !important;
}
.pricing-plan-apex.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):hover,
.pricing-plan-apex.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):focus,
.pricing-plan-apex.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]).md-focused {
  border-color: #172554;
  background: #172554 !important;
  color: #fff !important;
}
.pricing-plan-apex.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):hover,
.pricing-plan-apex.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):focus,
.pricing-plan-apex.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]).md-focused,
.pricing-plan-apex.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):hover *,
.pricing-plan-apex.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):focus *,
.pricing-plan-apex.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]).md-focused * {
  color: #fff !important;
}
.pricing-plan-card--featured.pricing-plan-card--current .pricing-plan-cta--manage.md-button {
  border-color: #fff;
  background: #fff !important;
  color: #0f172a !important;
}
.pricing-plan-card--featured.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):hover,
.pricing-plan-card--featured.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):focus {
  background: #f1f5f9 !important;
  border-color: #f1f5f9;
  color: #0f172a !important;
}
.pricing-plan-card--featured.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):hover,
.pricing-plan-card--featured.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):focus,
.pricing-plan-card--featured.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):hover *,
.pricing-plan-card--featured.pricing-plan-card--current .pricing-plan-cta--manage.md-button:not([disabled]):focus * {
  color: #0f172a !important;
}
.pricing-plan-cta--keep.md-button {
  border-color: #2563eb !important;
  background: #2563eb !important;
  color: #fff !important;
}
.pricing-plan-cta--keep.md-button:not([disabled]):hover,
.pricing-plan-cta--keep.md-button:not([disabled]):focus,
.pricing-plan-cta--keep.md-button:not([disabled]).md-focused {
  background: #1d4ed8 !important;
  border-color: #1d4ed8 !important;
  color: #fff !important;
}
.pricing-plan-cta--keep.md-button:not([disabled]):hover,
.pricing-plan-cta--keep.md-button:not([disabled]):focus,
.pricing-plan-cta--keep.md-button:not([disabled]).md-focused,
.pricing-plan-cta--keep.md-button:not([disabled]):hover *,
.pricing-plan-cta--keep.md-button:not([disabled]):focus *,
.pricing-plan-cta--keep.md-button:not([disabled]).md-focused * {
  color: #fff !important;
}
.pricing-plan-cta--cancel-downgrade.md-button {
  border-color: #d97706 !important;
  background: #fff !important;
  color: #92400e !important;
}
.pricing-plan-cta--cancel-downgrade.md-button:not([disabled]):hover,
.pricing-plan-cta--cancel-downgrade.md-button:not([disabled]):focus,
.pricing-plan-cta--cancel-downgrade.md-button:not([disabled]).md-focused {
  background: #fffbeb !important;
  border-color: #b45309 !important;
  color: #78350f !important;
}
.pricing-plan-cta--cancel-downgrade.md-button:not([disabled]):hover,
.pricing-plan-cta--cancel-downgrade.md-button:not([disabled]):focus,
.pricing-plan-cta--cancel-downgrade.md-button:not([disabled]).md-focused,
.pricing-plan-cta--cancel-downgrade.md-button:not([disabled]):hover *,
.pricing-plan-cta--cancel-downgrade.md-button:not([disabled]):focus *,
.pricing-plan-cta--cancel-downgrade.md-button:not([disabled]).md-focused * {
  color: #78350f !important;
}
.pricing-plan-scheduled-notice {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 600;
  color: #92400e;
  text-align: center;
}
.pricing-plan-cta.md-button[disabled],
.pricing-plan-cta.md-button[disabled]:hover,
.pricing-plan-cta.md-button[disabled]:focus,
.pricing-plan-cta.md-button[disabled]:active,
.pricing-plan-cta.md-button[disabled].md-focused {
  border-color: #e2e8f0 !important;
  background: #f1f5f9 !important;
  color: #64748b !important;
  box-shadow: none !important;
}
.pricing-business-band {
  position: relative;
  display: grid;
  grid-template-columns: minmax(280px, 0.75fr) minmax(420px, 1fr);
  gap: 36px;
  align-items: center;
  margin-top: 42px;
  padding: 36px;
  border: 1px solid #e2e8f0;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.05);
}
.pricing-business-band__intro {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}
.pricing-business-band__title {
  margin: 0;
  max-width: 520px;
  font-size: clamp(1.65rem, 2.6vw, 2.45rem);
  line-height: 1.12;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #0f172a;
}
.pricing-business-band__copy {
  margin: 14px 0 0;
  max-width: 460px;
  font-size: 16px;
  line-height: 1.65;
  color: #334155;
}
.pricing-business-band__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 22px;
}
.pricing-business-band__chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #f8fafc;
  color: #334155;
  font-size: 12px;
  font-weight: 700;
}
.pricing-business-band__chip::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 2px;
  background: #2563eb;
}
.pricing-business-band__chip:nth-child(2)::before {
  background: #475569;
}
.pricing-business-band__chip:nth-child(3)::before {
  background: #64748b;
}
.pricing-business-band__cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 18px;
  align-items: stretch;
}
.pricing-business-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 26px;
  border-radius: 14px;
  border: 1px solid #d8e1ee;
  background: #ffffff;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
}
.pricing-business-card::before {
  content: "";
  position: absolute;
  top: 26px;
  bottom: 26px;
  left: 0;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: #2563eb;
}
.pricing-business-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.pricing-business-card__kicker {
  margin: 0 0 4px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: #64748b;
}
.pricing-business-card__name {
  margin: 0;
  font-size: 26px;
  line-height: 1.1;
  font-weight: 700;
  color: #0f172a;
}
.pricing-business-card__price {
  flex-shrink: 0;
  padding: 7px 11px;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #f8fafc;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  color: #0f172a;
}
.pricing-business-card__feature-label {
  margin: 24px 0 10px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b;
}
.pricing-business-card__features {
  display: grid;
  gap: 0;
  margin: 0 0 24px;
  padding: 0;
  list-style: none;
  color: #334155;
  font-size: 14px;
  line-height: 1.5;
}
.pricing-business-card__features li {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 9px 0;
  border-bottom: 1px solid #eef2f7;
}
.pricing-business-card__features li:last-child {
  border-bottom: none;
}
.pricing-business-card__check {
  position: relative;
  width: 22px;
  height: 22px;
  margin-top: 0;
  border-radius: 50%;
  background: #f1f5f9;
}
.pricing-business-card__check::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 5px;
  width: 6px;
  height: 10px;
  border-right: 2px solid #2563eb;
  border-bottom: 2px solid #2563eb;
  transform: rotate(45deg);
}
.pricing-business-card__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  margin-top: auto;
  padding: 0 16px;
  border-radius: 8px;
  border: 1px solid #0f172a;
  background: #0f172a;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}
.pricing-business-card__cta-arrow {
  font-size: 16px;
  line-height: 1;
  transition: transform 0.2s ease;
}
.pricing-business-card__cta:hover,
.pricing-business-card__cta:focus {
  border-color: #2563eb;
  background: #2563eb;
  color: #fff;
  text-decoration: none;
  transform: translateY(-1px);
}
.pricing-business-card__cta:hover .pricing-business-card__cta-arrow,
.pricing-business-card__cta:focus .pricing-business-card__cta-arrow {
  transform: translateX(3px);
}
.pricing-details {
  margin-top: 72px;
}
.pricing-details-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.pd-card {
  display: flex;
  flex-direction: column;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  box-sizing: border-box;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.pd-card:hover {
  border-color: #cbd5e1;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06), 0 1px 4px rgba(0, 0, 0, 0.04);
}
.pd-card-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 20px 20px 16px;
  border-bottom: 1px solid #e2e8f0;
}
.pd-card-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pd-card-icon--questions {
  background: rgba(37, 99, 235, 0.1);
  color: #2563eb;
}
.pd-card-icon--data {
  background: rgba(217, 119, 6, 0.1);
  color: #d97706;
}
.pd-card-title {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: #0f172a;
}
.pd-card-badge {
  display: inline-flex;
  align-items: center;
  height: 22px;
  margin-top: 4px;
  padding: 0 8px;
  border-radius: 999px;
  background: rgba(37, 99, 235, 0.08);
  color: #2563eb;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.pd-card-badge--slate {
  background: #f3f4f6;
  color: #334155;
}
.pd-card-body {
  padding: 0px;
  flex: 1;
}
.pd-card-row {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 20px;
  border-bottom: 1px solid #e2e8f0;
  font-size: 14px;
  line-height: 1.55;
  color: #334155;
}
.pd-card-row:last-child {
  border-bottom: 0;
}
.pd-card-row--highlight {
  margin: 0 -20px;
  padding: 12px 20px;
  background: #f9fafb;
  border-bottom: 0;
}
.pd-card-row--topup {
  background: #f8fafc;
  border-top: 1px solid #e2e8f0;
  padding: 20px;
  margin: 0px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.pd-topup-left {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.pd-topup-price {
  display: flex;
  align-items: baseline;
  gap: 0;
  margin-top: 2px;
}
.pd-topup-note {
  color: #64748b;
  font-size: 12px;
  font-weight: 400;
  margin-top: 1px;
}
.pd-topup-cta {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 20px;
  border-radius: 8px;
  background: #2563eb;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.15s ease, box-shadow 0.15s ease;
}
.pd-topup-cta:hover,
.pd-topup-cta:focus {
  background: #1d4ed8;
  color: #fff;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25);
}
.pd-topup-cta svg {
  transition: transform 0.15s ease;
}
.pd-topup-cta:hover svg {
  transform: translateX(2px);
}
.pd-card-row-label {
  min-width: 64px;
  flex-shrink: 0;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #64748b;
}
.pd-mode-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 8px;
}
.pd-mode-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 12px;
  transition: background 0.15s ease;
}
.pd-mode-item:hover {
  background: rgba(100, 116, 139, 0.06);
}
.pd-mode-item--recommended {
  background: rgba(37, 99, 235, 0.08);
}
.pd-mode-item--recommended:hover {
  background: rgba(37, 99, 235, 0.1);
}
.pd-mode-item-check {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #2563eb;
  margin-top: 2px;
}
.pd-mode-item-check--empty {
  color: transparent;
}
.pd-mode-item-body {
  flex: 1 1 auto;
  min-width: 0;
}
.pd-mode-item-title {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;
  color: #0f172a;
  letter-spacing: -0.01em;
}
.pd-mode-item-desc {
  margin: 4px 0 0;
  font-size: 12.5px;
  line-height: 1.5;
  color: #64748b;
  font-weight: 400;
}
.pd-mode-item-credits {
  flex-shrink: 0;
  display: inline-flex;
  align-items: baseline;
  gap: 2px;
  margin-top: 2px;
  color: #2563eb;
  font-variant-numeric: tabular-nums;
}
.pd-mode-item-credits-num {
  font-size: 15px;
  font-weight: 600;
}
.pd-mode-item-credits-unit {
  font-size: 11px;
  font-weight: 500;
  color: rgba(37, 99, 235, 0.6);
  margin-left: 2px;
}
.pd-card-row-value {
  color: #0f172a;
  font-weight: 500;
}
.pd-card-row-value em {
  font-style: normal;
  color: #64748b;
}
.pd-card-row-note {
  color: #64748b;
  font-size: 12px;
  font-weight: 400;
}
.pd-price {
  color: #0f172a;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.03em;
}
.pd-price-unit {
  margin-left: 2px;
  color: #64748b;
  font-size: 13px;
  font-weight: 400;
}
.pd-card-tier-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
}
.pd-card-tier-plan {
  min-width: 72px;
  font-size: 13px;
  font-weight: 600;
  color: #0f172a;
}
.pd-card-tier-bar {
  flex: 1;
  height: 6px;
  border-radius: 999px;
  background: #f3f4f6;
  overflow: hidden;
}
.pd-card-tier-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #93c5fd;
}
.pd-card-tier-fill--pro {
  background: #60a5fa;
}
.pd-card-tier-fill--mid {
  background: #2563eb;
}
.pd-card-tier-fill--full {
  background: #1e3a8a;
}
.pd-card-tier-cap {
  min-width: 56px;
  text-align: right;
  font-size: 13px;
  font-weight: 600;
  color: #0f172a;
}
.pd-card-footer {
  padding: 12px 20px 16px;
  border-top: 1px solid #e2e8f0;
}
.pd-card-footer-hint {
  color: #64748b;
  font-size: 12px;
  line-height: 1.6;
}
.pd-card-footer-hint a {
  color: #2563eb;
  text-decoration: none;
}
.pd-card-footer-hint a:hover {
  text-decoration: underline;
}
.pricing-genetics {
  margin-top: 72px;
}
.pricing-genetics-tags {
  margin: 24px 0 20px;
}
.pg-hero-stat {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}
.pg-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 24px 16px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #fff;
  text-align: center;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
}
.pg-stat-num {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  color: #2563eb;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.pg-stat-label {
  font-size: 12px;
  font-weight: 500;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.pg-tracks {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}
.pg-track {
  padding: 20px 22px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.pg-track:hover {
  border-color: #cbd5e1;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06), 0 1px 4px rgba(0, 0, 0, 0.04);
}
.pg-track-title {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.01em;
}
.pg-track-desc {
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
  color: #334155;
}
.pg-capabilities {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
.pg-cap {
  padding: 24px 26px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.pg-cap:hover {
  border-color: #cbd5e1;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06), 0 1px 4px rgba(0, 0, 0, 0.04);
}
.pg-cap-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
  background: rgba(37, 99, 235, 0.08);
  color: #2563eb;
}
.pg-cap--prs .pg-cap-icon {
  background: rgba(5, 150, 105, 0.08);
  color: #059669;
}
.pg-cap--search .pg-cap-icon {
  background: rgba(37, 99, 235, 0.08);
  color: #2563eb;
}
.pg-cap--speed .pg-cap-icon {
  background: rgba(217, 119, 6, 0.08);
  color: #d97706;
}
.pg-cap--qc .pg-cap-icon {
  background: rgba(37, 99, 235, 0.08);
  color: #2563eb;
}
.pg-cap--workflow .pg-cap-icon {
  background: rgba(217, 119, 6, 0.08);
  color: #d97706;
}
.pg-cap-title {
  margin: 0 0 8px;
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.015em;
  line-height: 1.25;
}
.pg-cap-desc {
  margin: 0;
  font-size: 14px;
  line-height: 1.65;
  color: #334155;
}
.pricing-think-session-dialog {
  width: min(1120px, 96vw);
  max-width: 1120px;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.18);
  position: relative;
}
.bp-pricing-dialog {
  max-width: 1120px;
  width: min(96vw, 1120px);
  border-radius: 24px;
  overflow: hidden;
  background: linear-gradient(165deg, #e8f0fa 0%, #f0f6fc 100%);
  box-shadow: 0 28px 64px rgba(16, 32, 61, 0.22), 0 0 0 1px rgba(255, 255, 255, 0.6) inset;
}
body.bp-pricing-lock-active .wt2-skip-x {
  display: none !important;
  pointer-events: none !important;
}
.bp-pricing-shell {
  position: relative;
  border: 1px solid #c5d8ec;
  padding: 26px 26px 20px;
  background: radial-gradient(170% 90% at 0% 0%, rgba(53, 96, 182, 0.12) 0%, rgba(53, 96, 182, 0) 50%), radial-gradient(150% 80% at 100% 100%, rgba(26, 129, 102, 0.08) 0%, rgba(26, 129, 102, 0) 50%), #f8fbff;
}
.bp-pricing-header {
  text-align: center;
  margin-bottom: 16px;
}
.bp-pricing-eyebrow {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #607493;
  font-weight: 700;
  margin-bottom: 8px;
}
.bp-pricing-title {
  margin: 0 0 8px;
  color: #12243f;
  font-size: clamp(18px, 2.2vw, 22px);
  line-height: 1.2;
  letter-spacing: -0.02em;
  font-weight: 700;
}
.bp-pricing-subtitle {
  margin: 0 auto;
  max-width: 640px;
  font-size: 15px;
  line-height: 1.45;
  color: #5e7291;
}
.bp-pricing-top-actions {
  position: absolute;
  top: 16px;
  right: 16px;
  display: flex;
  align-items: center;
}
.bp-pricing-secondary-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid #c8d6ea;
  background: rgba(255, 255, 255, 0.92);
  color: #27415f;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}
.bp-pricing-secondary-btn:hover {
  background: #ffffff;
  border-color: #b6cae4;
  color: #142741;
  box-shadow: 0 8px 18px rgba(20, 39, 65, 0.08);
}
.bp-pricing-secondary-btn--switch {
  color: #1d4ed8;
  border-color: #bfd0f5;
  background: #eff6ff;
}
.bp-pricing-secondary-btn--switch:hover {
  color: #1e40af;
  border-color: #a9c0f0;
  background: #e5efff;
}
.bp-pricing-back-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 12px;
  color: #315989;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.bp-pricing-back-link:hover {
  text-decoration: underline;
}
.bp-pricing-intervals {
  display: flex;
  justify-content: center;
  margin: 0 0 14px;
}
.bp-pricing-segment {
  display: inline-grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  padding: 6px 4px;
  border-radius: 999px;
  border: 1px solid #c8d6ea;
  background: #dde7f6;
}
.bp-interval-btn {
  min-width: 118px;
  height: 38px;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  padding: 0 16px;
  font-size: 14px;
  font-weight: 700;
  color: #5f7393;
  background: transparent;
  transition: all 160ms ease;
}
.bp-interval-btn.is-active {
  color: #142741;
  background: #ffffff;
  box-shadow: 0 2px 7px rgba(20, 39, 65, 0.16);
}
.bp-interval-btn:disabled {
  cursor: not-allowed;
  opacity: 0.44;
}
.bp-pricing-error {
  margin-bottom: 12px;
  border-radius: 10px;
}
.bp-pricing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
  align-items: stretch;
}
.bp-plan-card {
  display: flex;
  flex-direction: column;
  min-height: 470px;
  border-radius: 18px;
  border: 1px solid #d0dff0;
  padding: 18px 18px 16px;
  background: #ffffff;
  box-shadow: 0 10px 28px rgba(24, 46, 81, 0.08);
  animation: bp-card-in 340ms ease both;
  transition: box-shadow 0.25s ease, transform 0.2s ease;
}
.bp-plan-card:hover {
  box-shadow: 0 14px 36px rgba(24, 46, 81, 0.12);
  transform: translateY(-2px);
}
.bp-plan-card--current {
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.25);
}
.bp-plan-card--current:hover {
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.25);
  transform: none;
}
.bp-plan-card:nth-child(1) {
  animation-delay: 40ms;
}
.bp-plan-card:nth-child(2) {
  animation-delay: 80ms;
}
.bp-plan-card:nth-child(3) {
  animation-delay: 120ms;
}
.bp-plan-card:nth-child(4) {
  animation-delay: 160ms;
}
@keyframes bp-card-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.bp-plan-free {
  background: linear-gradient(170deg, #f8fff9 0%, #f4fdf7 100%);
  border-color: #c7e6cf;
}
.bp-plan-pro {
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  border-color: #d4e0f2;
}
.bp-plan-founders {
  background: linear-gradient(180deg, #f8fbff 0%, #f4f8ff 100%);
  border-color: #d8e4f7;
}
.bp-plan-phd {
  background: linear-gradient(150deg, #f3f8ff 0%, #eef5ff 52%, #f8fbff 100%);
  border-color: #ccddf8;
}
.bp-plan-apex {
  background: linear-gradient(150deg, #f6f8ff 0%, #eff3ff 55%, #fafcff 100%);
  border-color: #d4def8;
}
.bp-plan-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.bp-plan-name {
  margin: 0;
  font-size: clamp(16px, 1.8vw, 18px);
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: #132946;
  font-weight: 700;
}
.bp-plan-tag {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  padding: 5px 10px;
  color: #30435f;
  background: #e9eff8;
  border: 1px solid #d6e1f2;
  white-space: nowrap;
}
.bp-plan-phd .bp-plan-tag {
  color: #b25a19;
  background: #ffe9d4;
  border-color: #ffd7b5;
}
.bp-plan-free .bp-plan-tag {
  color: #25653b;
  background: #dff2e4;
  border-color: #cae8d3;
}
.bp-plan-apex .bp-plan-tag {
  color: #324bb7;
  background: #e5ebff;
  border-color: #d7e1ff;
}
.bp-plan-tag--current {
  color: #1e40af;
  background: #dbeafe;
  border-color: #93c5fd;
}
.bp-plan-tag--featured {
  color: #2563eb;
  background: #eff6ff;
  border-color: #bfdbfe;
}
.bp-plan-price {
  font-size: clamp(20px, 2.2vw, 24px);
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: #162d4a;
  font-weight: 700;
  margin-bottom: 6px;
}
.bp-plan-price-struck {
  text-decoration: line-through;
  color: #8b95a5;
  font-weight: 500;
  margin-right: 0.35em;
}
.bp-plan-price-main {
  white-space: nowrap;
}
.bp-plan-billing {
  font-size: 13px;
  color: #607694;
  margin-bottom: 8px;
}
.bp-plan-annual-breakdown {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-bottom: 8px;
  font-size: 13px;
  color: #4f6687;
}
.bp-plan-annual-line {
  line-height: 1.35;
}
.bp-plan-savings {
  display: inline-flex;
  width: max-content;
  border-radius: 999px;
  border: 1px solid #c9dbf4;
  background: #e9f1fc;
  color: #2c5387;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 9px;
  margin-bottom: 10px;
}
.bp-plan-savings-inline {
  color: #059669;
  font-weight: 700;
}
.bp-plan-subtitle {
  min-height: 19px;
  font-size: 14px;
  line-height: 1.35;
  color: #4f6687;
  margin-bottom: 8px;
}
.bp-plan-credits {
  margin: 12px 0 0;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid rgba(37, 99, 235, 0.14);
  background: rgba(37, 99, 235, 0.04);
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.bp-plan-credits-amount {
  font-size: 16px;
  line-height: 1.2;
  font-weight: 700;
  color: #132946;
}
.bp-plan-credits-unit {
  font-size: 12px;
  line-height: 1.35;
  color: #607694;
}
.bp-plan-sections {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #dbe5f2;
}
.bp-plan-section-group + .bp-plan-section-group {
  margin-top: 10px;
}
.bp-plan-section-heading {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
  margin-bottom: 4px;
}
.bp-plan-features {
  display: grid;
  gap: 5px;
}
.bp-plan-feature {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 13px;
  line-height: 1.35;
  color: #253b5e;
}
.bp-plan-feature-mark {
  color: #2f6fe4;
  font-size: 10px;
  line-height: 1.5;
  margin-top: 2px;
}
.bp-plan-feature-group--genetics .bp-plan-feature-mark {
  color: #22a352;
}
.bp-plan-feature-group--ai .bp-plan-feature-mark {
  color: #4f6fa8;
}
.bp-plan-feature-group--storage .bp-plan-feature-mark {
  color: #8b9ab5;
}
.bp-plan-free .bp-plan-feature-mark {
  color: #2f7a46;
}
.bp-plan-apex .bp-plan-feature-mark {
  color: #3f60d8;
}
.bp-plan-cta-wrap {
  margin-top: auto;
  padding-top: 8px;
}
.bp-plan-cta.md-button {
  width: 100%;
  min-width: 0;
  height: 44px;
  margin: 0;
  border-radius: 11px;
  font-size: 15px;
  font-weight: 600;
  text-transform: none;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
  transition: background 0.2s ease, box-shadow 0.2s ease;
}
.bp-plan-free .bp-plan-cta.md-button {
  background: #2f7a46 !important;
  color: #fff !important;
}
.bp-plan-free .bp-plan-cta.md-button:not([disabled]):hover,
.bp-plan-free .bp-plan-cta.md-button:not([disabled]):focus,
.bp-plan-free .bp-plan-cta.md-button:not([disabled]):active {
  background: #256b3a !important;
  color: #fff !important;
}
.bp-plan-pro .bp-plan-cta.md-button {
  background: #2563eb !important;
  color: #fff !important;
}
.bp-plan-pro .bp-plan-cta.md-button:not([disabled]):hover,
.bp-plan-pro .bp-plan-cta.md-button:not([disabled]):focus,
.bp-plan-pro .bp-plan-cta.md-button:not([disabled]):active {
  background: #1d4ed8 !important;
  color: #fff !important;
}
.bp-plan-founders .bp-plan-cta.md-button {
  background: #3b82f6 !important;
  color: #fff !important;
}
.bp-plan-founders .bp-plan-cta.md-button:not([disabled]):hover,
.bp-plan-founders .bp-plan-cta.md-button:not([disabled]):focus,
.bp-plan-founders .bp-plan-cta.md-button:not([disabled]):active {
  background: #2563eb !important;
  color: #fff !important;
}
.bp-plan-phd .bp-plan-cta.md-button {
  background: #1e40af !important;
  color: #fff !important;
}
.bp-plan-phd .bp-plan-cta.md-button:not([disabled]):hover,
.bp-plan-phd .bp-plan-cta.md-button:not([disabled]):focus,
.bp-plan-phd .bp-plan-cta.md-button:not([disabled]):active {
  background: #1e3a8a !important;
  color: #fff !important;
}
.bp-plan-apex .bp-plan-cta.md-button {
  background: #1e3a8a !important;
  color: #fff !important;
}
.bp-plan-apex .bp-plan-cta.md-button:not([disabled]):hover,
.bp-plan-apex .bp-plan-cta.md-button:not([disabled]):focus,
.bp-plan-apex .bp-plan-cta.md-button:not([disabled]):active {
  background: #172554 !important;
  color: #fff !important;
}
.bp-plan-cta.md-button[disabled],
.bp-plan-cta.md-button[disabled]:hover,
.bp-plan-cta.md-button[disabled]:focus,
.bp-plan-cta.md-button[disabled]:active,
.bp-plan-cta.md-button[disabled].md-focused {
  background: #c9d1e0 !important;
  color: #5c6476 !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
}
.bp-pricing-footnote {
  margin-top: 16px;
  border: 1px solid #d6e1f0;
  border-radius: 14px;
  background: #f1f7ff;
  padding: 12px 16px;
  text-align: center;
  color: #4f6180;
  font-size: 12px;
  line-height: 1.5;
}
.bp-pricing-footnote a {
  color: #2d62b4;
  text-decoration: none;
  font-weight: 600;
}
.bp-pricing-footnote a:hover {
  text-decoration: underline;
}
.bp-pricing-full-page-link {
  display: inline-block;
  margin-top: 10px;
  color: #1a4d8c;
  font-weight: 700;
  font-size: 13px;
  cursor: pointer;
}
.bp-pricing-full-page-link:hover {
  text-decoration: underline;
}
@media (max-width: 760px) {
  .bp-pricing-content {
    padding: 12px;
  }
  .bp-pricing-shell {
    padding: 44px 12px 12px;
  }
  .bp-plan-card {
    min-height: 0;
  }
  .bp-plan-price {
    font-size: clamp(18px, 6vw, 22px);
  }
  .bp-pricing-grid {
    grid-template-columns: 1fr;
  }
  .bp-pricing-top-actions {
    top: 10px;
    right: 10px;
  }
}
.pricing-think-session-content {
  padding: 0;
  background: #f8fafc;
}
.pricing-think-session-shell {
  padding: 32px;
}
.pricing-think-session-heading {
  max-width: 780px;
  margin-bottom: 28px;
}
.pricing-think-session-close {
  position: absolute;
  top: 18px;
  right: 18px;
  z-index: 2;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 1px solid rgba(30, 58, 95, 0.12);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: #0f172a;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}
.pricing-think-session-close:hover,
.pricing-think-session-close:focus {
  background: #fff;
  border-color: rgba(30, 58, 95, 0.2);
  transform: translateY(-1px);
}
.pc-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  align-items: start;
}
.pc-card--hero {
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
}
.pc-card-inner {
  padding: 28px;
}
.pc-card-kicker {
  margin: 0 0 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #2563eb;
}
.pc-card-title {
  margin: 0 0 16px;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #0f172a;
  line-height: 1.25;
}
.pc-card-body {
  margin: 0;
  font-size: 15px;
  line-height: 1.65;
  color: #334155;
}
.pc-card-body + .pc-card-body {
  margin-top: 14px;
}
.pc-features {
  display: grid;
  gap: 12px;
}
.pc-feature {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 20px 24px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #fff;
  transition: border-color 0.2s, box-shadow 0.2s;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.pc-feature:hover {
  border-color: #cbd5e1;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
.pc-feature-icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(37, 99, 235, 0.08);
  color: #2563eb;
}
.pc-feature-icon--reports {
  background: rgba(37, 99, 235, 0.1);
  color: #2563eb;
}
.pc-feature-icon--medicine {
  background: rgba(5, 150, 105, 0.1);
  color: #059669;
}
.pc-feature-icon--research {
  background: rgba(217, 119, 6, 0.1);
  color: #d97706;
}
.pc-feature-icon--verification {
  background: rgba(15, 118, 110, 0.1);
  color: #0f766e;
}
.pc-feature-title {
  margin: 0 0 4px;
  font-size: 14px;
  font-weight: 600;
  color: #0f172a;
  letter-spacing: -0.01em;
}
.pc-feature-desc {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
  color: #334155;
}
.pricing-research {
  margin-top: 72px;
}
.pr-sources {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.pr-source-group {
  padding: 20px 24px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
}
.pr-source-heading {
  margin: 0 0 12px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #64748b;
}
.pr-source-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.pr-tag {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #f9fafb;
  color: #0f172a;
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.pr-tag:hover {
  border-color: #cbd5e1;
  background: #f1f5f9;
}
.pr-callout {
  margin-top: 20px;
  border-radius: 14px;
  border: 1px solid rgba(37, 99, 235, 0.2);
  background: rgba(37, 99, 235, 0.04);
  overflow: hidden;
}
.pr-callout-inner {
  padding: 24px 28px;
}
.pr-callout-text {
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: #334155;
}
.pr-callout-text strong {
  color: #0f172a;
  font-weight: 700;
}
.pricing-value-compare {
  margin-top: 48px;
  padding: 40px 44px 36px;
  background: linear-gradient(145deg, #0b1220 0%, #0f172a 100%);
  border-radius: 18px;
  box-shadow: 0 4px 24px rgba(15, 23, 42, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  position: relative;
  overflow: hidden;
}
.pricing-value-compare::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 480px;
  height: 480px;
  background: radial-gradient(circle at top right, rgba(59, 130, 246, 0.08), transparent 60%);
  pointer-events: none;
}
.pvc-header {
  position: relative;
  margin-bottom: 28px;
  max-width: 640px;
}
.pvc-eyebrow {
  margin: 0 0 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #60a5fa;
}
.pvc-title {
  margin: 0 0 10px;
  font-size: clamp(1.375rem, 2.5vw, 1.75rem);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: #f1f5f9;
}
.pvc-sub {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #cbd5e1;
}
.pvc-groups {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}
.pvc-group {
  padding: 20px 22px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.03);
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: border-color 0.2s ease, background 0.2s ease;
}
.pvc-group:hover {
  border-color: rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.05);
}
.pvc-group-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-bottom: 10px;
  margin-bottom: 2px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.pvc-group-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.pvc-group-dot--personal {
  background: #22c55e;
  box-shadow: 0 0 10px rgba(34, 197, 94, 0.4);
}
.pvc-group-dot--research {
  background: #f59e0b;
  box-shadow: 0 0 10px rgba(245, 158, 11, 0.4);
}
.pvc-group-dot--strategy {
  background: #a855f7;
  box-shadow: 0 0 10px rgba(168, 85, 247, 0.4);
}
.pvc-group-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #f1f5f9;
}
.pvc-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 2px 0;
}
.pvc-row-name {
  font-size: 13px;
  line-height: 1.45;
  color: #e2e8f0;
  font-weight: 500;
}
.pvc-row-price {
  flex-shrink: 0;
  font-size: 13px;
  font-weight: 600;
  color: #cbd5e1;
  font-variant-numeric: tabular-nums;
  text-decoration: line-through;
  text-decoration-color: rgba(203, 213, 225, 0.55);
  text-decoration-thickness: 1px;
}
.pvc-row--meta .pvc-row-name {
  color: #cbd5e1;
  font-weight: 400;
}
.pvc-row--meta .pvc-row-price {
  color: #94a3b8;
}
.pvc-bystro {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 18px 24px;
  border-radius: 12px;
  background: linear-gradient(90deg, rgba(37, 99, 235, 0.18), rgba(59, 130, 246, 0.1));
  border: 1px solid rgba(59, 130, 246, 0.3);
  box-shadow: 0 0 24px rgba(59, 130, 246, 0.15);
}
.pvc-bystro-left {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}
.pvc-bystro-badge {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding: 0 12px;
  border-radius: 6px;
  background: #fff;
  color: #428bca;
  font-family: "Raleway", "Helvetica Neue", sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  flex-shrink: 0;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}
.pvc-bystro-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.pvc-bystro-title {
  font-size: 15px;
  font-weight: 700;
  color: #f1f5f9;
  letter-spacing: -0.01em;
}
.pvc-bystro-sub {
  font-size: 12px;
  color: #cbd5e1;
  line-height: 1.4;
}
.pvc-bystro-right {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-shrink: 0;
}
.pvc-bystro-price {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #60a5fa;
  font-variant-numeric: tabular-nums;
}
.pvc-bystro-time {
  font-size: 13px;
  font-weight: 500;
  color: #e2e8f0;
}
@media (max-width: 960px) {
  .pvc-groups {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .pricing-value-compare {
    padding: 28px 22px 24px;
  }
  .pvc-bystro {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 18px;
  }
  .pvc-bystro-right {
    align-self: flex-end;
  }
}
.pricing-health {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.95fr);
  gap: 40px;
  align-items: center;
  margin-top: 48px;
  padding: 40px 44px;
  border-radius: 18px;
  border: 1px solid #e2e8f0;
  background: linear-gradient(135deg, #ffffff 0%, #f6f9fc 100%);
  box-shadow: 0 10px 36px rgba(15, 23, 42, 0.06);
}
.pricing-health__copy {
  max-width: 660px;
}
.pricing-health__title {
  margin: 0;
  font-size: 1.875rem;
  line-height: 1.2;
  font-weight: 700;
  color: #0f172a;
}
.pricing-health__lead {
  margin: 14px 0 0;
  font-size: 1rem;
  line-height: 1.7;
  color: #334155;
}
.pricing-health__panel {
  padding: 22px;
  border-radius: 14px;
  border: 1px solid rgba(37, 99, 235, 0.16);
  background: rgba(255, 255, 255, 0.74);
}
.pricing-health__panel-label {
  margin: 0 0 14px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #2563eb;
}
.pricing-health__questions {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0;
  padding: 0;
}
.pricing-health__question {
  display: grid;
  grid-template-columns: 70px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  padding: 14px 0;
  border-top: 1px solid #e2e8f0;
}
.pricing-health__question:first-child {
  border-top: 0;
  padding-top: 0;
}
.pricing-health__question:last-child {
  padding-bottom: 0;
}
.pricing-health__question-kicker {
  display: inline-flex;
  justify-content: center;
  min-width: 58px;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(5, 150, 105, 0.1);
  color: #059669;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}
.pricing-health__question-text {
  font-size: 14px;
  line-height: 1.55;
  color: #0f172a;
}
@media (max-width: 960px) {
  .pricing-health {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .pricing-health {
    padding: 28px 22px;
  }
  .pricing-health__title {
    font-size: 1.5rem;
  }
}
@media (max-width: 520px) {
  .pricing-health__question {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .pricing-health__question-kicker {
    justify-self: start;
  }
}
.pricing-research {
  display: grid;
  grid-template-columns: minmax(360px, 0.95fr) minmax(0, 1.05fr);
  gap: 40px;
  align-items: start;
  margin-top: 24px;
  padding: 40px 44px;
  border-radius: 18px;
  border: 1px solid #e2e8f0;
  background: linear-gradient(135deg, #ffffff 0%, #f6f9fc 100%);
  box-shadow: 0 10px 36px rgba(15, 23, 42, 0.06);
}
.pricing-research__copy {
  max-width: 660px;
}
.pricing-research__title {
  margin: 0;
  font-size: 1.875rem;
  line-height: 1.2;
  font-weight: 700;
  color: #0f172a;
}
.pricing-research__lead {
  margin: 14px 0 0;
  font-size: 1rem;
  line-height: 1.7;
  color: #334155;
}
.pricing-research__dash-note {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid rgba(37, 99, 235, 0.2);
}
.pricing-research__dash-badge {
  display: inline-flex;
  align-items: center;
  margin-bottom: 6px;
  border-radius: 999px;
  color: #2563eb;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  white-space: nowrap;
}
.pricing-research__dash-desc {
  display: block;
  font-size: 13px;
  line-height: 1.6;
  color: #334155;
}
.pricing-research__panel {
  padding: 22px;
  border-radius: 14px;
  border: 1px solid rgba(37, 99, 235, 0.16);
  background: rgba(255, 255, 255, 0.74);
}
.pricing-research__panel-label {
  margin: 0 0 14px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #2563eb;
}
.pricing-research__tasks {
  width: 100%;
  border-collapse: collapse;
  border: none;
  margin: 0;
  padding: 0;
}
.pricing-research__tasks td {
  border: none;
}
.pricing-research__task + .pricing-research__task td {
  border-top: 1px solid #e2e8f0;
}
.pricing-research__task-kicker-cell {
  white-space: nowrap;
  width: 1%;
  padding: 14px 14px 14px 0;
  vertical-align: top;
}
.pricing-research__task:first-child td {
  padding-top: 0;
}
.pricing-research__task:last-child td {
  padding-bottom: 0;
}
.pricing-research__task-kicker {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  white-space: nowrap;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(37, 99, 235, 0.1);
  color: #2563eb;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}
.pricing-research__task-text {
  font-size: 14px;
  line-height: 1.55;
  color: #0f172a;
  padding: 14px 0;
  vertical-align: top;
}
@media (max-width: 960px) {
  .pricing-research {
    grid-template-columns: 1fr;
  }
  .pricing-research__panel {
    order: -1;
  }
}
@media (max-width: 760px) {
  .pricing-research {
    padding: 28px 22px;
  }
  .pricing-research__title {
    font-size: 1.5rem;
  }
}
@media (max-width: 520px) {
  .pricing-research__tasks,
  .pricing-research__tasks tbody,
  .pricing-research__task {
    display: block;
  }
  .pricing-research__task {
    padding: 14px 0;
    border-top: 1px solid #e2e8f0;
  }
  .pricing-research__task:first-child {
    border-top: 0;
    padding-top: 0;
  }
  .pricing-research__task + .pricing-research__task td {
    border-top: 0;
  }
  .pricing-research__task-kicker-cell {
    display: block;
    padding: 0 0 8px;
    width: auto;
  }
  .pricing-research__task-text {
    display: block;
    padding: 0;
  }
}
.pricing-footnote {
  margin: 40px 0 0;
  padding-top: 24px;
  border-top: 1px solid #e2e8f0;
  text-align: center;
  color: #64748b;
  font-size: 13px;
}
.pricing-footnote a {
  color: #2563eb;
  text-decoration: none;
}
.pricing-footnote a:hover {
  text-decoration: underline;
}
.pricing-loading {
  min-height: 320px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  color: #64748b;
  font-size: 14px;
  font-weight: 500;
}
@media (max-width: 900px) {
  .pricing-grid--primary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 1080px) {
  .pricing-policy-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .pg-capabilities {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .pricing-business-band {
    grid-template-columns: 1fr;
    padding: 32px;
  }
  .pricing-grid--business {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .pricing-page {
    padding-bottom: 60px;
  }
  .pricing-hero {
    padding: 36px 16px 16px;
  }
  .pricing-hero-subtitle {
    font-size: 0.9375rem;
  }
  .pricing-content {
    padding: 0 20px;
  }
  .pricing-scheduled-strip {
    align-items: stretch;
    flex-direction: column;
  }
  .pricing-scheduled-strip__actions {
    width: 100%;
  }
  .pricing-scheduled-strip__button {
    flex: 1;
  }
  .pricing-policy {
    padding: 16px;
  }
  .pricing-policy-grid,
  .pricing-grid--primary,
  .pricing-grid--business,
  .pricing-details-grid,
  .pricing-business-band__cards {
    grid-template-columns: 1fr;
  }
  .pricing-business-band {
    margin-top: 28px;
    padding: 22px;
  }
  .pricing-business-card {
    padding: 22px;
  }
  .pricing-business-card__head {
    flex-direction: column;
  }
  .pricing-business-card__price {
    align-self: flex-start;
  }
  .pricing-business-card__cta {
    width: 100%;
    box-sizing: border-box;
  }
  .pricing-plan-card {
    padding: 20px;
    border-radius: 14px;
    min-height: 0;
  }
  .pricing-plan-head {
    flex-direction: column;
  }
  .pricing-plan-subtitle-line {
    flex-direction: column;
    gap: 4px;
  }
  .pricing-plan-scheduled-note {
    text-align: left;
  }
  .pricing-plan-badges {
    justify-content: flex-start;
  }
  .pricing-plan-summary {
    min-height: 0;
  }
  .pricing-plan-session-line {
    flex-wrap: wrap;
  }
  .pricing-plan-layout {
    grid-template-columns: 1fr;
  }
  .pd-card-header,
  .pd-card-body,
  .pd-card-footer {
    padding-left: 16px;
    padding-right: 16px;
  }
  .pg-hero-stat {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .pg-tracks {
    grid-template-columns: 1fr;
  }
  .pg-capabilities {
    grid-template-columns: 1fr;
  }
  .pricing-think-session-shell {
    padding: 24px 20px 20px;
  }
  .pricing-think-session-close {
    top: 14px;
    right: 14px;
  }
  .pc-grid {
    grid-template-columns: 1fr;
  }
  .pr-sources {
    grid-template-columns: 1fr;
  }
  .pd-card-row--topup {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    margin-left: -16px;
    margin-right: -16px;
    padding-left: 16px;
    padding-right: 16px;
  }
  .pd-topup-cta {
    justify-content: center;
  }
  .pd-card-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  .pd-card-row--highlight {
    margin-left: -16px;
    margin-right: -16px;
    padding-left: 16px;
    padding-right: 16px;
  }
  .pd-mode-list {
    padding: 6px;
  }
  .pd-mode-item {
    padding: 12px;
    gap: 8px;
  }
  .pd-mode-item-title {
    font-size: 14px;
  }
  .pd-mode-item-desc {
    font-size: 12px;
  }
  .pricing-status-line {
    border-radius: 14px;
    padding: 10px 14px;
  }
}
@media (max-width: 520px) {
  .pricing-hero-pills {
    gap: 6px;
  }
  .pricing-hero-pill {
    width: 100%;
    justify-content: center;
  }
  .pricing-interval-btn {
    min-width: 88px;
    padding: 0 14px;
  }
}
/* ═══════════════════════════════════════════════
   Showcase — "See it in action"
   ═══════════════════════════════════════════════ */
.pricing-showcase {
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
}
/* ── Category tabs ── */
.ps-tabs {
  display: flex;
  gap: 6px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 48px;
  margin-bottom: 56px;
}
.ps-tab {
  padding: 8px 20px;
  border-radius: 100px;
  border: 1px solid #e2e8f0;
  background: transparent;
  color: #64748b;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  font-family: inherit;
}
.ps-tab:hover {
  border-color: #0f172a;
  color: #0f172a;
}
.ps-tab.is-active {
  background: #0f172a;
  color: #fff;
  border-color: #0f172a;
}
/* ── Case card (alternating left/right) ── */
.ps-case {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
  margin-bottom: 80px;
}
.ps-case--right {
  direction: rtl;
}
.ps-case--right > * {
  direction: ltr;
}
.ps-case-text {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.ps-case-tag {
  display: inline-block;
  width: fit-content;
  padding: 4px 12px;
  border-radius: 100px;
  background: rgba(37, 99, 235, 0.1);
  color: #2563eb;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.ps-case-tag--green {
  background: rgba(16, 185, 129, 0.1);
  color: #059669;
}
.ps-case-tag--amber {
  background: rgba(245, 158, 11, 0.1);
  color: #d97706;
}
.ps-case-tag--purple {
  background: rgba(139, 92, 246, 0.1);
  color: #7c3aed;
}
.ps-case-title {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
  margin: 0;
}
.ps-case-desc {
  font-size: 15px;
  line-height: 1.65;
  color: #64748b;
  margin: 0;
}
.ps-case-highlights {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 8px;
}
.ps-highlight {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #64748b;
  line-height: 1.5;
}
.ps-highlight::before {
  content: '';
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #2563eb;
  flex-shrink: 0;
}
.ps-highlight strong {
  color: #0f172a;
  font-weight: 600;
}
/* ── Mockup frames ── */
.ps-case-visual {
  position: relative;
}
.ps-mockup {
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06), 0 1px 4px rgba(0, 0, 0, 0.04);
  transition: transform 0.3s, box-shadow 0.3s;
}
.ps-mockup:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.1), 0 2px 8px rgba(0, 0, 0, 0.06);
}
.ps-mockup--dark {
  border-color: #2d2d2d;
  background: #1a1a1a;
}
.ps-mockup--screenshot img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12px;
}
.ps-mockup-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 14px;
  background: #fafafa;
  border-bottom: 1px solid #e2e8f0;
}
.ps-mockup--dark .ps-mockup-bar {
  background: #222;
  border-bottom-color: #333;
}
.ps-mockup-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ddd;
}
.ps-mockup-dot:first-child {
  background: #ff5f57;
}
.ps-mockup-dot:nth-child(2) {
  background: #febc2e;
}
.ps-mockup-dot:nth-child(3) {
  background: #28c840;
}
.ps-mockup-title {
  margin-left: 8px;
  font-size: 11px;
  font-weight: 500;
  color: #64748b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ps-mockup--dark .ps-mockup-title {
  color: rgba(255, 255, 255, 0.5);
}
.ps-mockup-body {
  padding: 20px;
  background: #fff;
  min-height: 180px;
}
.ps-mockup-body--dark {
  background: #1a1a1a;
}
/* ── Skeleton elements ── */
.ps-mock-heading {
  width: 50%;
  height: 14px;
  background: #e5e7eb;
  border-radius: 4px;
  margin-bottom: 12px;
}
.ps-mock-heading--light {
  background: rgba(255, 255, 255, 0.12);
}
.ps-mock-text {
  height: 8px;
  background: #f3f4f6;
  border-radius: 3px;
  margin-bottom: 6px;
}
.ps-mock-text--bold {
  height: 10px;
  background: #e5e7eb;
}
.ps-mock-text--light {
  background: rgba(255, 255, 255, 0.08);
}
.ps-mock-text--light.ps-mock-text--bold {
  background: rgba(255, 255, 255, 0.14);
}
.ps-mock-spacer {
  height: 16px;
}
/* ── Skeleton chart ── */
.ps-mock-chart {
  width: 100%;
  height: 80px;
  border-radius: 6px;
  overflow: hidden;
  margin-bottom: 12px;
  background: #fafafa;
}
.ps-mock-chart svg {
  width: 100%;
  height: 100%;
}
.ps-mock-chart--manhattan {
  background: #1a1a1a;
}
.ps-mock-chart--volcano {
  background: #fafafa;
  height: 120px;
}
/* ── Skeleton table ── */
.ps-mock-table {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 8px;
}
.ps-mock-table-row {
  display: flex;
  gap: 6px;
}
.ps-mock-table-row span {
  height: 10px;
  background: #f3f4f6;
  border-radius: 3px;
}
.ps-mock-table-row--header span {
  background: #e5e7eb;
  height: 12px;
}
/* ── Math blocks ── */
.ps-mock-math {
  font-family: 'Times New Roman', Georgia, serif;
  font-size: 15px;
  color: #0f172a;
  padding: 12px 16px;
  background: #fafafa;
  border-radius: 6px;
  margin: 8px 0 12px;
  text-align: center;
  letter-spacing: 0.02em;
}
/* ── Flow diagram ── */
.ps-mock-flow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
  margin: 8px 0;
}
.ps-flow-node {
  padding: 6px 14px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.7);
  font-size: 12px;
  font-weight: 500;
}
.ps-flow-node--accent {
  background: rgba(37, 99, 235, 0.15);
  border-color: rgba(37, 99, 235, 0.3);
  color: #2563eb;
}
.ps-flow-arrow {
  color: rgba(255, 255, 255, 0.3);
  font-size: 14px;
}
/* ── Trust bar ── */
.ps-trust-bar {
  display: flex;
  justify-content: center;
  gap: 40px;
  flex-wrap: wrap;
  padding: 40px 0 0;
  border-top: 1px solid #e2e8f0;
  margin-top: 0;
}
.ps-trust-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #64748b;
}
.ps-trust-item svg {
  color: #2563eb;
  flex-shrink: 0;
}
/* ── Responsive ── */
@media (max-width: 768px) {
  .ps-case {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .ps-case--right {
    direction: ltr;
  }
  .ps-case-visual {
    order: -1;
  }
  .ps-tabs {
    gap: 4px;
  }
  .ps-tab {
    font-size: 13px;
    padding: 6px 14px;
  }
  .ps-trust-bar {
    gap: 20px;
    flex-direction: column;
    align-items: center;
  }
}
/* ── Skeleton shimmer animation ── */
@keyframes ps-shimmer {
  0% {
    background-position: -200px 0;
  }
  100% {
    background-position: 200px 0;
  }
}
.ps-mockup-body .ps-mock-text,
.ps-mockup-body .ps-mock-heading,
.ps-mockup-body .ps-mock-table-row span {
  background-size: 400px 100%;
  animation: ps-shimmer 2.5s ease-in-out infinite;
}
.ps-mockup-body .ps-mock-text {
  background-image: linear-gradient(90deg, #f3f4f6 0%, #e9eaed 40%, #f3f4f6 80%);
}
.ps-mockup-body .ps-mock-heading {
  background-image: linear-gradient(90deg, #e5e7eb 0%, #dcdee2 40%, #e5e7eb 80%);
}
.ps-mockup-body .ps-mock-table-row span {
  background-image: linear-gradient(90deg, #f3f4f6 0%, #e9eaed 40%, #f3f4f6 80%);
}
.ps-mockup-body .ps-mock-table-row--header span {
  background-image: linear-gradient(90deg, #e5e7eb 0%, #dcdee2 40%, #e5e7eb 80%);
}
.ps-mockup-body .ps-mock-text--bold {
  background-image: linear-gradient(90deg, #e5e7eb 0%, #dcdee2 40%, #e5e7eb 80%);
}
/* Dark mockup shimmer */
.ps-mockup-body--dark .ps-mock-text {
  background-image: linear-gradient(90deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.12) 40%, rgba(255, 255, 255, 0.06) 80%);
}
.ps-mockup-body--dark .ps-mock-heading {
  background-image: linear-gradient(90deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.16) 40%, rgba(255, 255, 255, 0.1) 80%);
}
.ps-mockup-body--dark .ps-mock-text--bold {
  background-image: linear-gradient(90deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0.18) 40%, rgba(255, 255, 255, 0.12) 80%);
}
.pricing-how-it-works .hiw-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin-top: 48px;
}
@media (max-width: 1180px) {
  .pricing-how-it-works .hiw-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 700px) {
  .pricing-how-it-works .hiw-grid {
    grid-template-columns: 1fr;
  }
}
.pricing-how-it-works .hiw-card {
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 12px;
  padding: 28px 24px 24px;
  background: var(--pricing-card-bg, #fff);
}
.dark-theme .pricing-how-it-works .hiw-card {
  border-color: rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
}
.pricing-how-it-works .hiw-card-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}
.pricing-how-it-works .hiw-card-icon.hiw-card-icon--literature,
.pricing-how-it-works .hiw-card-icon.hiw-card-icon--plan {
  background: rgba(99, 102, 241, 0.1);
  color: #6366f1;
}
.pricing-how-it-works .hiw-card-icon.hiw-card-icon--files,
.pricing-how-it-works .hiw-card-icon.hiw-card-icon--ondemand {
  background: rgba(245, 158, 11, 0.1);
  color: #f59e0b;
}
.pricing-how-it-works .hiw-card-icon.hiw-card-icon--analysis,
.pricing-how-it-works .hiw-card-icon.hiw-card-icon--prepaid {
  background: rgba(16, 185, 129, 0.1);
  color: #10b981;
}
.pricing-how-it-works .hiw-card-icon.hiw-card-icon--projects {
  background: rgba(37, 99, 235, 0.1);
  color: #2563eb;
}
.pricing-how-it-works .hiw-card-title {
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 8px;
}
.pricing-how-it-works .hiw-card-desc {
  font-size: 14px;
  line-height: 1.55;
  color: var(--pricing-muted, #555);
  margin: 0;
}
.dark-theme .pricing-how-it-works .hiw-card-desc {
  color: rgba(255, 255, 255, 0.65);
}
.pricing-how-it-works .hiw-card-detail {
  display: flex;
  gap: 8px;
  font-size: 13px;
  padding-top: 16px;
  border-top: 1px solid rgba(0, 0, 0, 0.07);
}
.dark-theme .pricing-how-it-works .hiw-card-detail {
  border-top-color: rgba(255, 255, 255, 0.08);
}
.pricing-how-it-works .hiw-card-detail-label {
  font-weight: 600;
  color: var(--pricing-muted, #555);
}
.dark-theme .pricing-how-it-works .hiw-card-detail-label {
  color: rgba(255, 255, 255, 0.5);
}
.pricing-how-it-works .hiw-card-detail-value {
  color: var(--pricing-muted, #555);
}
.dark-theme .pricing-how-it-works .hiw-card-detail-value {
  color: rgba(255, 255, 255, 0.65);
}
.pricing-how-it-works .hiw-footnote {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 24px;
  font-size: 13px;
  color: var(--pricing-muted, #666);
  line-height: 1.5;
}
.dark-theme .pricing-how-it-works .hiw-footnote {
  color: rgba(255, 255, 255, 0.5);
}
.pricing-how-it-works .hiw-footnote-icon {
  flex-shrink: 0;
  margin-top: 1px;
  opacity: 0.6;
}
.pricing-qa .pqa-layout {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 48px;
  align-items: start;
}
@media (max-width: 800px) {
  .pricing-qa .pqa-layout {
    grid-template-columns: 1fr;
    gap: 32px;
  }
}
.pricing-qa .pqa-label {
  position: sticky;
  top: 80px;
}
.pricing-qa .pqa-label-title {
  font-size: clamp(1.375rem, 2.5vw, 1.875rem);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
  margin: 0;
}
.pricing-qa .pqa-list {
  display: flex;
  flex-direction: column;
}
.pricing-qa .pqa-item {
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.dark-theme .pricing-qa .pqa-item {
  border-bottom-color: rgba(255, 255, 255, 0.1);
}
.pricing-qa .pqa-item:first-child {
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}
.dark-theme .pricing-qa .pqa-item:first-child {
  border-top-color: rgba(255, 255, 255, 0.1);
}
.pricing-qa .pqa-q {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 18px 0;
  background: none;
  border: none;
  text-align: left;
  cursor: pointer;
  font-size: 16px;
  font-weight: 600;
  color: inherit;
  line-height: 1.4;
}
.pricing-qa .pqa-chevron {
  flex-shrink: 0;
  transition: transform 0.2s ease;
  opacity: 0.55;
}
.pricing-qa .pqa-chevron.pqa-chevron--open {
  transform: rotate(180deg);
  opacity: 1;
}
.pricing-qa .pqa-a {
  font-size: 14px;
  line-height: 1.65;
  color: var(--pricing-muted, #555);
  padding-bottom: 18px;
}
.dark-theme .pricing-qa .pqa-a {
  color: rgba(255, 255, 255, 0.65);
}
.pricing-qa .pqa-a a {
  color: inherit;
  text-decoration: underline;
}
/**
 * Billing UI on /user/account — colors from src/less/variables.less (@light-blue, @blue, @white).
 * Imported by src/less/main.less (do not duplicate in account.tpl.html).
 */
/**
 * These are the variables used throughout the application. This is where 
 * overwrites that are not specific to components should be maintained.
 */
/**
 * Typography-related.
 */
/* Uses site-wide Raleway — no extra font import needed */
/* ═══════════════════════════════════════════════════════
   Billing redesign — bil- prefixed, self-contained
   ═══════════════════════════════════════════════════════ */
/* ── Type scale (semantic) ── */
:root {
  --bil-fs-display: 32px;
  /* hero metric (100%) */
  --bil-fs-amount-xl: 24px;
  /* card-level primary amounts */
  --bil-fs-amount-lg: 20px;
  /* secondary amounts (on-demand total) */
  --bil-fs-amount-md: 18px;
  /* tertiary amounts (prepaid total) */
  --bil-fs-title: 16px;
  /* card section titles */
  --bil-fs-input: 15px;
  /* form inputs, tier numbers */
  --bil-fs-value: 14px;
  /* rail values, inline prices */
  --bil-fs-body: 13px;
  /* labels, buttons, links */
  --bil-fs-caption: 12px;
  /* meta, dates, hints */
  --bil-fs-micro: 11px;
  /* chips, badges, section labels */
}
.bil-card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  overflow: visible;
  margin-bottom: 12px;
}
.bil-card + .bil-card {
  margin-top: 0;
}
/* ── Card header ── */
.bil-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 16px 20px;
  border-bottom: 1px solid #f3f4f6;
}
.bil-header-left {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
  min-width: 0;
}
.bil-plan-name {
  margin: 0;
  font-size: var(--bil-fs-title);
  font-weight: 700;
  color: #111827;
  letter-spacing: -0.02em;
}
.bil-meta {
  font-size: var(--bil-fs-caption);
  font-weight: 500;
  color: #9ca3af;
}
.bil-chip {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: var(--bil-fs-micro);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
  flex-shrink: 0;
}
.bil-chip.is-ok {
  color: #065f46;
  background: #d1fae5;
}
.bil-chip.is-warning {
  color: #92400e;
  background: #fef3c7;
}
.bil-chip.is-trialing {
  color: #065f46;
  background: #d1fae5;
}
.bil-chip-link {
  display: inline-flex;
  align-items: center;
  border: none;
  background: transparent;
  color: #428bca;
  font-size: var(--bil-fs-caption);
  font-weight: 600;
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
}
.bil-chip-link:hover:not(:disabled) {
  color: #36465d;
  text-decoration: underline;
}
.bil-chip-link:disabled {
  opacity: 0.4;
  cursor: not-allowed;
  text-decoration: none;
}
/* ── Timeline (scheduled plan change) ── */
.bil-timeline {
  display: flex;
  align-items: center;
  gap: 0;
}
.bil-tl-node {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-shrink: 0;
}
.bil-tl-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.bil-tl-node.is-now .bil-tl-dot {
  background: #36465d;
  box-shadow: 0 0 0 3px rgba(54, 70, 93, 0.12);
}
.bil-tl-node.is-next .bil-tl-dot {
  background: #d1d5db;
}
.bil-tl-plan {
  font-size: var(--bil-fs-body);
  font-weight: 700;
  letter-spacing: -0.01em;
}
.bil-tl-node.is-now .bil-tl-plan {
  color: #111827;
}
.bil-tl-node.is-next .bil-tl-plan {
  color: #6b7280;
}
.bil-tl-meta {
  font-size: var(--bil-fs-micro);
  font-weight: 500;
  color: #9ca3af;
}
.bil-tl-line {
  flex: 1;
  height: 1px;
  min-width: 20px;
  margin: 0 10px;
  background: repeating-linear-gradient(90deg, #d1d5db 0, #d1d5db 4px, transparent 4px, transparent 8px);
}
/* ── Hero area ── */
.bil-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 20px 14px;
}
.bil-hero-left {
  min-width: 0;
}
.bil-hero-pct {
  display: block;
  font-size: 24px;
  font-weight: 800;
  color: #111827;
  letter-spacing: -0.04em;
  line-height: 1;
}
.bil-hero-sub {
  display: block;
  margin-top: 4px;
  font-size: var(--bil-fs-caption);
  font-weight: 500;
  color: #9ca3af;
}
.bil-hero-right {
  flex-shrink: 0;
  text-align: right;
}
.bil-hero-label {
  display: block;
  font-size: var(--bil-fs-micro);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #9ca3af;
  margin-bottom: 4px;
}
.bil-hero-amount {
  display: block;
  font-size: var(--bil-fs-amount-xl);
  font-weight: 700;
  letter-spacing: -0.035em;
  font-variant-numeric: tabular-nums;
  color: #111827;
  line-height: 1;
}
/* ── Stacked progress bar ── */
.bil-bar {
  display: flex;
  align-items: stretch;
  gap: 3px;
  height: 6px;
  margin: 0 20px 14px;
  border-radius: 999px;
  background: #f3f4f6;
}
.bil-bar-seg {
  height: 100%;
  border-radius: 999px;
  transition: flex-basis 300ms ease;
  flex-shrink: 0;
  min-width: 0;
}
.bil-bar-seg--plan {
  background: #428bca;
}
.bil-bar-seg--ondemand {
  background: #10b981;
}
.bil-bar-seg--prepaid {
  background: #0ea5e9;
}
/* ── Funding rails ── */
.bil-rails {
  display: grid;
  gap: 12px;
  padding: 0 20px 18px;
}
.bil-rail {
  display: grid;
  gap: 6px;
}
.bil-rail-bar-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.bil-rail-bar-row .bil-rail-track {
  flex: 1;
  min-width: 0;
}
.bil-rail-pct {
  font-size: var(--bil-fs-micro);
  font-weight: 600;
  color: #9ca3af;
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
  min-width: 32px;
  text-align: right;
}
.bil-rail-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}
.bil-rail-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: var(--bil-fs-body);
  font-weight: 600;
  color: #4b5563;
  letter-spacing: -0.01em;
}
.bil-rail-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  flex-shrink: 0;
}
.bil-rail-dot--plan {
  background: #428bca;
}
.bil-rail-dot--prepaid {
  background: #0ea5e9;
}
.bil-rail-dot--ondemand {
  background: #10b981;
}
.bil-rail-value {
  font-size: var(--bil-fs-value);
  font-weight: 700;
  color: #111827;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.bil-rail-track {
  position: relative;
  height: 4px;
  border-radius: 999px;
  background: #f3f4f6;
  overflow: hidden;
}
.bil-rail-fill {
  position: absolute;
  inset: 0 auto 0 0;
  height: 100%;
  border-radius: inherit;
  transition: width 300ms ease;
}
.bil-rail-fill--plan {
  background: #428bca;
}
.bil-rail-fill--prepaid {
  background: #0ea5e9;
}
.bil-rail-fill--ondemand {
  background: #10b981;
}
/* ── Compact summary line ── */
.bil-compact-summary {
  padding: 0 20px 2px;
}
.bil-compact-line {
  font-size: var(--bil-fs-caption);
  font-weight: 500;
  color: #9ca3af;
  font-style: italic;
}
/* ── Legend ── */
.bil-legend {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 6px 20px 0;
}
.bil-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--bil-fs-caption);
  font-weight: 500;
  color: #6b7280;
}
.bil-legend-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  flex-shrink: 0;
}
.bil-legend-dot--plan {
  background: #428bca;
}
.bil-legend-dot--prepaid {
  background: #0ea5e9;
}
.bil-legend-dot--ondemand {
  background: #10b981;
}
/* ── Show details toggle ── */
.bil-details-toggle {
  padding: 8px 20px 4px;
  border-top: 1px solid #f3f4f6;
  margin-top: 10px;
}
.bil-details-toggle-btn {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  padding: 4px 0;
  border: none;
  background: transparent;
  font-size: var(--bil-fs-body);
  font-weight: 500;
  font-family: inherit;
  color: #6b7280;
  cursor: pointer;
  transition: color 0.12s;
}
.bil-details-toggle-btn:hover {
  color: #111827;
}
.bil-details-toggle-icon {
  font-size: 18px !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  margin: 0 !important;
  transition: transform 0.2s ease;
  color: inherit !important;
}
.bil-details-toggle-icon.is-open {
  transform: rotate(180deg);
}
/* ── Bar segment tooltips ── */
.bil-bar-seg--hoverable {
  position: relative;
  cursor: default;
}
.bil-bar-seg--hoverable::after {
  content: attr(data-bil-tooltip);
  position: absolute;
  bottom: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  white-space: pre-line;
  padding: 8px 12px;
  border-radius: 8px;
  background: #fff;
  color: #111827;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, 0.08);
  border: 1px solid #e5e7eb;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s ease;
  z-index: 10;
  min-width: 130px;
  text-align: left;
}
.bil-bar-seg--hoverable:hover::after {
  opacity: 1;
}
/* ── Card footer ── */
.bil-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 20px;
  border-top: 1px solid #f3f4f6;
}
.bil-footer-actions {
  display: flex;
  align-items: center;
  gap: 14px;
}
.bil-btn-outline {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 7px 14px;
  font-size: var(--bil-fs-body);
  font-weight: 600;
  font-family: inherit;
  color: #36465d;
  background: #fff;
  border: 1px solid #ddeaf5;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s;
  white-space: nowrap;
}
.bil-btn-outline:hover:not(:disabled) {
  background: #f4f8fc;
  border-color: #cadff0;
}
.bil-btn-outline:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
/* Filled CTA — external billing portal (visually distinct from in-app text links) */
.bil-btn-external {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px 8px 16px;
  font-size: var(--bil-fs-body);
  font-weight: 600;
  font-family: inherit;
  color: #FFFFFF;
  background: #36465d;
  border: 1px solid #36465d;
  border-radius: 8px;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(33, 33, 33, 0.12);
  transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
  white-space: nowrap;
}
.bil-btn-external:hover:not(:disabled) {
  background: #415570;
  border-color: #415570;
  box-shadow: 0 2px 6px rgba(33, 33, 33, 0.14);
}
.bil-btn-external:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.bil-btn-external__icon {
  font-size: 16px !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
  margin: 0 !important;
  opacity: 0.9;
}
.bil-link {
  font-size: var(--bil-fs-body);
  font-weight: 500;
  color: #428bca;
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.12s;
}
.bil-link:hover {
  color: #36465d;
  text-decoration: underline;
}
/* In-app navigation in the billing card footer — not a second CTA */
.bil-footer-actions .bil-link--subtle {
  font-weight: 400;
  color: #64748b;
  text-decoration: none;
  border-bottom: 1px solid #e2e8f0;
  padding-bottom: 1px;
  transition: color 0.12s, border-color 0.12s;
}
.bil-footer-actions .bil-link--subtle:hover {
  color: #212121;
  text-decoration: none;
  border-bottom-color: #94a3b8;
}
.bil-hint {
  font-size: var(--bil-fs-caption);
  color: #9ca3af;
}
.bil-hint a {
  color: #428bca;
  text-decoration: none;
}
.bil-hint a:hover {
  text-decoration: underline;
}
.bil-warn {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0 20px 16px;
  padding: 10px 14px;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 8px;
  color: #92400e;
  font-size: var(--bil-fs-caption);
  line-height: 1.4;
}
.bil-warn .material-icons {
  font-size: var(--bil-fs-title);
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin-top: 1px;
  margin-left: 0px;
  margin-bottom: 0px;
  min-width: 16px;
  margin-right: 0px;
  min-height: 16px;
}
.bil-warn strong {
  font-weight: 600;
}
/* ═══════ On-demand card ═══════ */
.bil-section-eyebrow {
  color: #4b5563;
  font-size: var(--bil-fs-body);
  font-weight: 600;
  margin: 18px 0 8px;
}
.bil-od-simple {
  padding: 0;
}
.bil-od-simple-row {
  align-items: center;
  display: flex;
  gap: 18px;
  justify-content: space-between;
  padding: 16px 20px;
}
.bil-od-simple-row:not(.bil-od-simple-row--controls) {
  align-items: flex-start;
  flex-direction: column;
  gap: 8px;
  justify-content: flex-start;
  padding: 20px;
}
.bil-od-simple-row--controls {
  align-items: center;
  flex-wrap: nowrap;
  padding-bottom: 8px;
}
.bil-od-simple-row--controls .bil-od-simple-copy {
  flex: 1 1 auto;
}
.bil-od-simple-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.bil-od-simple-copy h4 {
  color: #111827;
  font-size: var(--bil-fs-title);
  font-weight: 600;
  letter-spacing: 0;
  margin: 0;
}
.bil-od-simple-row:not(.bil-od-simple-row--controls) .bil-od-simple-copy h4 {
  color: #6b7280;
  font-size: var(--bil-fs-body);
}
.bil-od-simple-copy p {
  color: #6b7280;
  font-size: var(--bil-fs-body);
  line-height: 1.4;
  margin: 0;
}
.bil-od-simple-amount {
  color: #111827;
  flex: 0 0 auto;
  font-size: var(--bil-fs-title);
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.1;
  text-align: right;
  white-space: nowrap;
}
.bil-od-simple-row:not(.bil-od-simple-row--controls) .bil-od-simple-amount {
  text-align: left;
}
.bil-od-simple-divider {
  background: #f3f4f6;
  height: 1px;
  margin: 0 20px;
}
.bil-od-simple-meter {
  background: #f3f4f6;
  border-radius: 999px;
  height: 4px;
  margin: 0 20px 16px;
  overflow: hidden;
  position: relative;
}
.bil-od-simple-meter--unlimited {
  background: repeating-linear-gradient(-45deg, #e5e7eb, #e5e7eb 2px, transparent 2px, transparent 6px);
}
.bil-od-simple-meter-fill {
  background: #428bca;
  border-radius: inherit;
  height: 100%;
  inset: 0 auto 0 0;
  position: absolute;
  transition: width 300ms ease;
}
.bil-od-simple-meter--unlimited .bil-od-simple-meter-fill {
  display: none;
}
.bil-od-simple-controls {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  flex-wrap: nowrap;
  gap: 10px;
  justify-content: flex-end;
  max-width: 100%;
  min-width: 0;
}
.bil-od-simple-note {
  color: #6b7280;
  font-size: var(--bil-fs-caption);
  font-weight: 500;
  line-height: 1.35;
  padding: 0 20px 16px;
}
.bil-od-mode-select {
  appearance: none;
  background: linear-gradient(45deg, transparent 50%, #9ca3af 50%), linear-gradient(135deg, #9ca3af 50%, transparent 50%), #fff;
  background-position: calc(100% - 15px) 50%, calc(100% - 10px) 50%, 0 0;
  background-repeat: no-repeat;
  background-size: 5px 5px, 5px 5px, 100% 100%;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  box-sizing: border-box;
  color: #111827;
  field-sizing: content;
  font-family: inherit;
  font-size: var(--bil-fs-body);
  font-weight: 500;
  flex: 0 0 auto;
  height: 38px;
  min-width: 92px;
  padding: 0 30px 0 12px;
  width: auto;
}
.bil-od-mode-select:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}
.bil-od-mode-select:focus {
  border-color: #428bca;
  box-shadow: 0 0 0 3px rgba(66, 139, 202, 0.1);
  outline: none;
}
.bil-credit-lite {
  padding: 0;
}
.bil-credit-lite-row {
  align-items: center;
  display: flex;
  gap: 18px;
  justify-content: space-between;
  padding: 16px 20px;
}
.bil-credit-lite-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.bil-credit-lite-copy h4 {
  color: #111827;
  font-size: var(--bil-fs-title);
  font-weight: 600;
  letter-spacing: 0;
  margin: 0;
}
.bil-credit-lite-copy p {
  color: #6b7280;
  font-size: var(--bil-fs-body);
  line-height: 1.4;
  margin: 0;
}
.bil-credit-lite-amount {
  color: #111827;
  flex: 0 0 auto;
  font-size: var(--bil-fs-title);
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.1;
  text-align: right;
  white-space: nowrap;
}
.bil-credit-lite-divider {
  background: #f3f4f6;
  height: 1px;
  margin: 0 20px;
}
.bil-credit-lite-controls {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: 10px;
  justify-content: flex-end;
}
.bil-credit-lite-input {
  box-sizing: border-box;
  gap: 10px;
  width: 112px;
}
.bil-credit-lite-prefix {
  align-items: center;
  display: inline-flex;
  gap: 3px;
  line-height: 1;
}
.bil-credit-lite-plus,
.bil-credit-lite-dollar,
.bil-credit-lite-suffix {
  display: inline-flex;
  font-size: inherit;
  font-weight: inherit;
  line-height: 1;
}
.bil-credit-lite-plus {
  align-items: center;
}
.bil-credit-lite-input .bil-od-input {
  width: 54px;
}
.bil-credit-history {
  background: #fff;
  border-color: #e5e7eb;
  color: #111827;
  overflow: hidden;
  padding: 0;
}
.bil-credit-history-top {
  align-items: center;
  display: flex;
  gap: 18px;
  justify-content: space-between;
  padding: 20px;
}
.bil-credit-history-summary {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.bil-credit-history-summary span {
  color: #6b7280;
  font-size: var(--bil-fs-body);
  font-weight: 600;
}
.bil-credit-history-summary strong {
  color: #111827;
  font-size: var(--bil-fs-title);
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.1;
}
.bil-credit-history-actions {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: 10px;
  justify-content: flex-end;
}
.bil-credit-history-meta {
  align-items: center;
  color: #6b7280;
  display: flex;
  flex-wrap: wrap;
  font-size: var(--bil-fs-caption);
  font-weight: 500;
  gap: 8px 16px;
  justify-content: space-between;
  line-height: 1.35;
  padding: 0 20px 14px;
}
.bil-credit-history-notice {
  margin: 0 20px 14px;
  padding: 8px 12px;
}
.bil-credit-history-discount {
  flex: 0 0 auto;
  margin-left: auto;
  text-align: right;
}
.bil-credit-history-input {
  background: #fff;
  border-color: #e5e7eb;
  box-sizing: border-box;
  color: #111827;
  flex: 0 0 92px;
  gap: 6px;
  min-width: 92px;
  padding: 0 10px;
  width: 92px;
}
.bil-credit-history-input:focus-within {
  border-color: #428bca;
  box-shadow: 0 0 0 3px rgba(66, 139, 202, 0.1);
}
.bil-credit-history-input .bil-od-currency,
.bil-credit-history-input .bil-od-input {
  color: #111827;
}
.bil-credit-history-input .bil-od-input {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
}
.bil-credit-history-input .bil-credit-lite-suffix {
  color: #6b7280;
  flex: 0 0 auto;
  font-size: var(--bil-fs-caption);
  font-weight: 600;
  margin-left: 2px;
}
.bil-credit-history-input .bil-od-input::placeholder {
  color: #9ca3af;
}
.bil-credit-history-button {
  background: #fff;
  border-radius: 8px;
  border-color: #e5e7eb;
  color: #111827;
  flex: 0 0 78px;
  min-width: 78px;
  padding: 0 8px;
  white-space: nowrap;
  width: 78px;
}
.bil-credit-history-button:hover:not(:disabled) {
  background: #f9fafb;
  border-color: #d1d5db;
  color: #111827;
}
.bil-credit-history-button:disabled {
  background: #fff;
  border-color: #e5e7eb;
  color: #9ca3af;
}
.bil-credit-history-table {
  border-radius: 12px 12px 0 0;
  overflow: hidden;
}
.bil-credit-history-head,
.bil-credit-history-row {
  align-items: center;
  column-gap: 16px;
  display: grid;
  grid-template-columns: minmax(110px, 1fr) minmax(130px, 1.1fr) minmax(110px, 0.8fr) minmax(90px, 0.7fr);
}
.bil-credit-history-head {
  background: #f9fafb;
  color: #374151;
  font-size: var(--bil-fs-body);
  font-weight: 700;
  padding: 12px 20px;
}
.bil-credit-history-row {
  background: #fff;
  border-top: 1px solid #f3f4f6;
  color: #111827;
  font-size: var(--bil-fs-body);
  padding: 16px 20px;
}
.bil-credit-history-row strong {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
.bil-credit-history-head span:nth-child(n+3),
.bil-credit-history-row strong {
  justify-self: end;
  text-align: right;
}
.bil-credit-history-empty {
  background: #fff;
  border-top: 1px solid #f3f4f6;
  color: #6b7280;
  font-size: var(--bil-fs-body);
  padding: 16px 20px;
}
.bil-credit-history-footer {
  border-top: 1px solid #f3f4f6;
  padding: 12px 20px 16px;
}
.bil-credit-history-load {
  align-items: center;
  background: transparent;
  border: 1px solid #d1d5db;
  border-radius: 999px;
  color: #374151;
  cursor: pointer;
  display: inline-flex;
  font-family: inherit;
  font-size: var(--bil-fs-caption);
  font-weight: 600;
  height: 34px;
  justify-content: center;
  padding: 0 14px;
}
.bil-credit-history-load:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.bil-od {
  padding: 0 0 16px;
  display: grid;
  gap: 0;
}
.bil-credits-header {
  align-items: flex-start;
  border-bottom: 1px solid #f3f4f6;
  display: flex;
  gap: 24px;
  justify-content: space-between;
  padding: 20px;
}
.bil-credits-header-copy {
  flex: 1 1 auto;
  min-width: 0;
}
.bil-credits-subtitle {
  color: #6b7280;
  font-size: var(--bil-fs-caption);
  line-height: 1.45;
  margin: 6px 0 0;
}
.bil-credits-available {
  display: grid;
  flex-shrink: 0;
  gap: 5px;
  justify-items: end;
  text-align: right;
}
.bil-credits-available span,
.bil-credits-subhead span {
  color: #64748b;
  font-size: var(--bil-fs-caption);
  font-weight: 600;
}
.bil-credits-available strong {
  color: #111827;
  font-size: var(--bil-fs-amount-lg);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1;
}
.bil-credits-topup {
  padding-bottom: 16px;
}
.bil-credits-subhead {
  align-items: baseline;
  display: flex;
  gap: 14px;
  justify-content: space-between;
  padding: 16px 20px 0;
}
.bil-credits-subhead strong {
  color: #111827;
  font-size: var(--bil-fs-amount-md);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1;
  text-align: right;
}
.bil-od-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 20px;
  border-bottom: 1px solid #f3f4f6;
}
.bil-prepurchase {
  border-top: 1px solid #f3f4f6;
  margin: 14px 20px 0;
  padding-top: 14px;
}
.bil-prepurchase-row {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between;
}
.bil-prepurchase-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.bil-prepurchase-copy strong {
  color: #111827;
  font-size: var(--bil-fs-body);
  font-weight: 700;
}
.bil-prepurchase-copy span {
  color: #6b7280;
  font-size: var(--bil-fs-caption);
}
.bil-prepurchase-toggle {
  align-items: center;
  background: #fff;
  border: 1px solid #c7d2fe;
  border-radius: 999px;
  color: #1d4ed8;
  cursor: pointer;
  display: inline-flex;
  flex-shrink: 0;
  font-family: inherit;
  font-size: var(--bil-fs-caption);
  font-weight: 700;
  gap: 6px;
  padding: 7px 12px;
  transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
}
.bil-prepurchase-toggle:hover:not(:disabled) {
  background: #eff6ff;
  border-color: #93c5fd;
}
.bil-prepurchase-toggle:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
.bil-prepurchase-toggle .material-icons {
  font-size: 16px;
  height: 16px;
  line-height: 16px;
  margin: 0;
  min-height: 16px;
  width: 16px;
}
.bil-prepurchase-panel {
  border-top: 1px solid #f3f4f6;
  margin-top: 14px;
  padding-top: 2px;
}
.bil-prepurchase-panel .bil-pp-body {
  padding: 14px 0 0;
}
.bil-prepurchase-panel .bil-pp-checkout {
  padding: 14px 0 0;
}
.bil-od-title {
  margin: 0;
  font-size: var(--bil-fs-title);
  font-weight: 700;
  color: #111827;
  letter-spacing: -0.015em;
}
.bil-od-amount {
  flex: 0 0 auto;
  font-size: var(--bil-fs-amount-lg);
  font-weight: 700;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
  color: #111827;
  line-height: 1;
  min-width: max-content;
  text-align: right;
  white-space: nowrap;
}
.bil-od-bar {
  position: relative;
  height: 4px;
  border-radius: 999px;
  background: #f3f4f6;
  overflow: hidden;
  margin: 12px 20px 0;
}
.bil-od-bar-fill {
  position: absolute;
  inset: 0 auto 0 0;
  height: 100%;
  border-radius: inherit;
  background: #10b981;
  transition: width 300ms ease;
}
.bil-od-bar-label {
  font-size: var(--bil-fs-caption);
  color: #6b7280;
  padding: 4px 20px 0;
}
.bil-od-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  padding: 14px 20px 0;
  border-top: 1px solid #f3f4f6;
  margin-top: 12px;
}
.bil-segmented {
  display: inline-flex;
  align-items: center;
  padding: 3px;
  border-radius: 10px;
  background: #f0f1f3;
  gap: 2px;
  border: none;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.06);
}
.bil-seg-btn {
  position: relative;
  border: none;
  background: transparent;
  border-radius: 7px;
  padding: 7px 18px;
  font-size: var(--bil-fs-body);
  font-weight: 600;
  font-family: inherit;
  color: #9ca3af;
  cursor: pointer;
  transition: background 0.2s, color 0.2s, box-shadow 0.2s, transform 0.1s;
  letter-spacing: -0.01em;
}
.bil-seg-btn:hover:not(:disabled):not(.is-active) {
  color: #374151;
  background: rgba(255, 255, 255, 0.45);
}
.bil-seg-btn.is-active {
  background: #fff;
  color: #111827;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.04);
}
.bil-seg-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.bil-od-fixed-input {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 38px;
  padding: 0 12px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fff;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.bil-od-fixed-input:focus-within {
  border-color: #428bca;
  box-shadow: 0 0 0 3px rgba(66, 139, 202, 0.1);
}
.bil-od-fixed-input--simple {
  box-sizing: border-box;
  flex: 0 0 96px;
  min-width: 96px;
  width: 96px;
}
.bil-od-fixed-input--simple .bil-od-input {
  width: 54px;
}
.bil-od-currency {
  font-size: var(--bil-fs-input);
  font-weight: 700;
  color: #111827;
}
.bil-od-input {
  width: 80px;
  padding: 0;
  border: none;
  background: transparent;
  font-size: var(--bil-fs-input);
  font-weight: 600;
  font-family: inherit;
  color: #111827;
  outline: none;
  appearance: textfield;
  -moz-appearance: textfield;
}
.bil-od-input::-webkit-inner-spin-button,
.bil-od-input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.bil-od-suffix {
  font-size: var(--bil-fs-caption);
  font-weight: 500;
  color: #9ca3af;
  white-space: nowrap;
}
.bil-btn-save {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 38px;
  padding: 0 18px;
  margin: 0;
  font-size: var(--bil-fs-body);
  font-weight: 600;
  font-family: inherit;
  color: #111827;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.12s, border-color 0.12s;
}
.bil-btn-save:hover:not(:disabled) {
  background: #f9fafb;
  border-color: #d1d5db;
}
.bil-btn-save:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.bil-btn-save--compact {
  box-sizing: border-box;
  flex: 0 0 78px;
  min-width: 78px;
}
.bil-od-error,
.bil-od-notice {
  align-items: flex-start;
  border-radius: 8px;
  display: flex;
  font-size: var(--bil-fs-caption);
  gap: 8px;
  line-height: 1.5;
  margin: 0 20px 16px;
  padding: 10px 14px;
}
.bil-od-error {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #991b1b;
}
.bil-od-notice--info {
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  color: #1e3a8a;
}
.bil-od-notice--success {
  background: #ecfdf5;
  border: 1px solid #bbf7d0;
  color: #065f46;
}
.bil-od-error .material-icons,
.bil-od-notice .material-icons {
  flex-shrink: 0;
  font-size: 16px;
  height: 18px;
  line-height: 18px;
  margin: 1px 0 0;
  min-height: 18px;
}
.bil-od-error .material-icons {
  color: #dc2626;
}
.bil-od-notice--info > .material-icons {
  color: #2563eb;
}
.bil-od-notice--success > .material-icons {
  color: #059669;
}
.bil-od-notice span {
  flex: 1;
}
.bil-od-notice button {
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  line-height: 1;
  opacity: 0.6;
  padding: 0;
}
.bil-od-presets {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  padding: 10px 20px 0;
}
.bil-od-presets-hint {
  font-size: var(--bil-fs-caption);
  color: #9ca3af;
  margin-left: auto;
}
.bil-preset {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  padding: 0 12px;
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  background: #fff;
  font-size: var(--bil-fs-body);
  font-weight: 600;
  font-family: inherit;
  color: #374151;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s, color 0.12s;
}
.bil-preset:hover:not(:disabled):not(.is-active) {
  background: #f9fafb;
  border-color: #d1d5db;
}
.bil-preset.is-active {
  background: #f4f8fc;
  border-color: #cadff0;
  color: #36465d;
}
.bil-preset:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.bil-od-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 20px 0;
}
.bil-od-footer-hint {
  font-size: var(--bil-fs-micro);
  color: #d1d5db;
}
.bil-od-ledger-wrap {
  padding: 14px 20px 16px;
}
/* ── Ledger (shared between on-demand + prepaid) ── */
.bil-ledger {
  border-top: 1px solid #f3f4f6;
  padding-top: 14px;
}
.bil-ledger-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0;
  border: none;
  background: transparent;
  font-size: var(--bil-fs-caption);
  font-weight: 600;
  font-family: inherit;
  color: #6b7280;
  cursor: pointer;
  transition: color 0.12s;
}
.bil-ledger-toggle:hover {
  color: #36465d;
}
.bil-ledger-toggle .caret {
  display: inline-block;
  transition: transform 0.2s;
  font-size: 14px;
}
.bil-ledger-toggle.is-open .caret {
  transform: rotate(180deg);
}
.bil-ledger-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.bil-ledger-label {
  font-size: var(--bil-fs-micro);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #9ca3af;
}
.bil-ledger-note {
  font-size: var(--bil-fs-micro);
  color: #d1d5db;
}
.bil-ledger-list {
  display: grid;
}
.bil-ledger-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 0;
  border-top: 1px solid #f3f4f6;
}
.bil-ledger-row:first-child,
.bil-ledger-item:first-child .bil-ledger-row,
.bil-ledger-cycle-divider + .bil-ledger-row {
  padding-top: 0;
  border-top: none;
}
.bil-ledger-cycle-divider {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 14px 0 12px;
  font-size: var(--bil-fs-micro);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #6b7280;
}
.bil-ledger-cycle-divider::before,
.bil-ledger-cycle-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: #e5e7eb;
}
.bil-ledger-item:first-child .bil-ledger-cycle-divider {
  margin-top: 0;
}
.bil-ledger-empty {
  padding: 6px 0 4px;
  font-size: var(--bil-fs-body);
  color: #6b7280;
  font-style: italic;
}
.bil-ledger-empty + .bil-ledger-item .bil-ledger-cycle-divider {
  margin-top: 8px;
}
.bil-ledger-primary {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
}
.bil-ledger-primary strong {
  font-size: var(--bil-fs-body);
  font-weight: 700;
  color: #111827;
  font-variant-numeric: tabular-nums;
}
.bil-ledger-primary span {
  font-size: var(--bil-fs-caption);
  color: #9ca3af;
}
.bil-ledger-secondary {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.bil-ledger-desc {
  font-size: var(--bil-fs-caption);
  font-weight: 500;
  color: #6b7280;
}
.bil-status {
  display: inline-flex;
  border-radius: 999px;
  font-size: var(--bil-fs-micro);
  font-weight: 600;
  padding: 2px 8px;
}
.bil-status.is-success {
  color: #065f46;
  background: #d1fae5;
}
.bil-status.is-pending {
  color: #92400e;
  background: #fef3c7;
}
.bil-status.is-bonus {
  color: #065f46;
  background: #d1fae5;
}
/* ═══════ Usage credit card ═══════ */
.bil-pp-header {
  padding: 20px 20px 0;
}
.bil-pp-title {
  margin: 0;
  font-size: var(--bil-fs-title);
  font-weight: 700;
  color: #111827;
  letter-spacing: -0.015em;
}
.bil-pp-subtitle {
  margin: 6px 0 0;
  font-size: 13px;
  line-height: 1.5;
  color: #6b7280;
}
.bil-pp-body {
  padding: 16px 20px 0;
}
.bil-pp-config-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 16px;
}
/* tier cards */
.bil-pp-tiers {
  display: flex;
  gap: 6px;
  margin-bottom: 14px;
}
.bil-pp-tier-card {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  padding: 10px 6px 8px;
  border: 1.5px solid #e5e7eb;
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
  font-family: inherit;
}
.bil-pp-tier-card:hover:not(:disabled):not(.is-active) {
  border-color: #a4c2de;
  background: #fafbfc;
}
.bil-pp-tier-card.is-active {
  border-color: #428bca;
  background: rgba(66, 139, 202, 0.03);
  box-shadow: 0 0 0 3px rgba(66, 139, 202, 0.08);
}
.bil-pp-tier-card:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.bil-pp-tier-qty {
  font-size: 18px;
  font-weight: 700;
  color: #111827;
  line-height: 1;
}
.bil-pp-tier-card.is-active .bil-pp-tier-qty {
  color: #36465d;
}
.bil-pp-tier-label {
  font-size: var(--bil-fs-micro);
  color: #b0b5bd;
  font-weight: 500;
  margin-bottom: 3px;
}
.bil-pp-tier-per {
  font-size: var(--bil-fs-body);
  font-weight: 700;
  color: #111827;
  font-variant-numeric: tabular-nums;
}
.bil-pp-tier-per small {
  font-size: var(--bil-fs-micro);
  font-weight: 500;
  color: #9ca3af;
}
.bil-pp-tier-total {
  font-size: var(--bil-fs-micro);
  font-weight: 500;
  color: #9ca3af;
  font-variant-numeric: tabular-nums;
  margin-top: 1px;
}
.bil-pp-tier-save {
  font-size: 10px;
  font-weight: 600;
  color: #059669;
  background: #ecfdf5;
  border-radius: 10px;
  padding: 1px 6px;
  margin-top: 3px;
  letter-spacing: 0.01em;
}
/* custom quantity row */
.bil-pp-custom-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding-bottom: 4px;
}
.bil-pp-custom-label {
  font-size: var(--bil-fs-caption);
  color: #9ca3af;
  font-weight: 500;
  white-space: nowrap;
}
.bil-pp-custom-suffix {
  font-size: var(--bil-fs-caption);
  color: #9ca3af;
  font-weight: 500;
}
.bil-pp-qty-input {
  width: 56px;
  padding: 5px 4px;
  font-size: var(--bil-fs-input);
  font-weight: 700;
  font-family: inherit;
  color: #111827;
  background: #f9fafb;
  border: 1.5px solid #e5e7eb;
  border-radius: 8px;
  outline: none;
  text-align: center;
  appearance: textfield;
  -moz-appearance: textfield;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.bil-pp-qty-input::-webkit-inner-spin-button,
.bil-pp-qty-input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.bil-pp-qty-input:focus {
  border-color: #428bca;
  box-shadow: 0 0 0 3px rgba(66, 139, 202, 0.1);
  background: #fff;
}
/* checkout bar */
.bil-pp-checkout {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 20px;
  border-top: 1px solid #f3f4f6;
  margin-top: 8px;
}
.bil-pp-checkout-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.bil-pp-checkout-price-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.bil-pp-total-amount {
  font-size: var(--bil-fs-amount-md);
  font-weight: 700;
  color: #111827;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.bil-pp-total-na {
  color: #d1d5db;
}
.bil-pp-savings {
  font-size: var(--bil-fs-micro);
  font-weight: 600;
  color: #059669;
  background: #ecfdf5;
  border-radius: 4px;
  padding: 1px 6px;
}
.bil-pp-balance-note {
  font-size: var(--bil-fs-caption);
  color: #6b7280;
  line-height: 1.4;
}
.bil-pp-balance-credits {
  font-weight: 700;
  color: #36465d;
}
.bil-btn-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 20px;
  font-size: var(--bil-fs-body);
  font-weight: 600;
  font-family: inherit;
  color: #fff;
  background: #428bca;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
  letter-spacing: -0.01em;
  flex-shrink: 0;
}
.bil-btn-cta[disabled] {
  opacity: 0.4;
  cursor: not-allowed;
}
.bil-pp-ledger {
  padding: 14px 20px 16px;
  border-top: 1px solid #f3f4f6;
}
/* ═══════ Activity chart (restyle) ═══════ */
.bil-activity {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  margin-top: 12px;
  overflow: hidden;
}
.bil-activity-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 14px 20px;
  border-bottom: 1px solid #f3f4f6;
}
.bil-activity-head h4 {
  margin: 0;
  font-size: var(--bil-fs-value);
  font-weight: 700;
  color: #111827;
  letter-spacing: -0.015em;
}
.bil-activity-select {
  padding: 5px 10px;
  font-size: var(--bil-fs-caption);
  font-weight: 500;
  font-family: inherit;
  color: #374151;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  outline: none;
  cursor: pointer;
}
.bil-activity-select:focus {
  border-color: #428bca;
  box-shadow: 0 0 0 2px rgba(66, 139, 202, 0.1);
}
.bil-kpis {
  display: flex;
  border-bottom: 1px solid #f3f4f6;
}
.bil-kpi {
  flex: 1 1 0;
  padding: 12px 20px;
  border-right: 1px solid #f3f4f6;
}
.bil-kpi:last-child {
  border-right: none;
}
.bil-kpi span {
  display: block;
  font-size: var(--bil-fs-micro);
  font-weight: 600;
  color: #9ca3af;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 2px;
}
.bil-kpi strong {
  font-size: var(--bil-fs-value);
  font-weight: 700;
  color: #111827;
  font-variant-numeric: tabular-nums;
}
.bil-chart {
  height: 120px;
  padding: 12px 16px 14px;
}
.bil-chart-empty {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #9ca3af;
  font-size: var(--bil-fs-caption);
}
.bil-chart-bars {
  height: 100%;
  display: flex;
  align-items: flex-end;
  gap: 3px;
}
.bil-chart-col {
  flex: 1 1 0;
  height: 100%;
  display: flex;
  align-items: flex-end;
}
.bil-chart-bar {
  width: 100%;
  min-height: 2px;
  border-radius: 3px 3px 1px 1px;
  background: #428bca;
  transition: height 200ms ease;
}
.bil-chart-bar.is-future {
  background: #e5e7eb;
}
.bil-chart-axis {
  display: flex;
  justify-content: space-between;
  padding: 6px 16px 12px;
  font-size: var(--bil-fs-micro);
  color: #9ca3af;
}
/* ── Access warning ── */
.bil-usage-notice {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0 0 10px;
  padding: 10px 12px;
  background: #fffcf2;
  border: 1px solid #f8dfa8;
  border-radius: 8px;
  color: #5f3b08;
}
.bil-usage-notice__icon {
  font-size: 16px !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
  color: #b45309 !important;
  margin: 1px 0 0 !important;
}
.bil-usage-notice__copy {
  min-width: 0;
}
.bil-usage-notice__title {
  display: inline;
  margin-right: 6px;
  color: #4a2d04;
  font-size: var(--bil-fs-body);
  font-weight: 700;
  letter-spacing: 0;
}
.bil-usage-notice span {
  color: #775013;
  font-size: var(--bil-fs-body);
  line-height: 1.4;
}
.bil-alert {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0 0 12px;
  padding: 12px 14px;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 10px;
  color: #92400e;
  font-size: var(--bil-fs-body);
  line-height: 1.45;
}
.bil-alert md-icon {
  font-size: 18px !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  color: #d97706 !important;
  margin: 0;
}
.bil-alert strong {
  display: block;
  font-weight: 600;
  margin-bottom: 4px;
}
.bil-alert p {
  margin: 0;
}
.bil-alert--positive {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #065f46;
}
.bil-alert--positive md-icon {
  color: #059669 !important;
}
.bil-alert-btn {
  margin-top: 8px;
  padding: 6px 14px;
  font-size: var(--bil-fs-caption);
  font-weight: 600;
  font-family: inherit;
  color: #fff;
  background: #d97706;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.15s;
}
.bil-alert-btn:hover {
  background: #b45309;
}
.bil-period-note {
  margin-top: 10px;
  font-size: var(--bil-fs-caption);
  color: #9ca3af;
}
/* ── Responsive ── */
@media (max-width: 640px) {
  .bil-hero {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .bil-hero-right {
    text-align: left;
  }
  .bil-footer {
    align-items: stretch;
    flex-direction: column;
    gap: 8px;
  }
  .bil-footer-actions {
    flex-wrap: wrap;
    width: 100%;
  }
  .bil-hint {
    align-self: center;
    display: block;
    text-align: center;
    width: 100%;
  }
  .bil-od-header {
    flex-direction: column;
    gap: 6px;
  }
  .bil-od-simple-row {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
  }
  .bil-credit-lite-row {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
  }
  .bil-od-simple-amount {
    text-align: left;
  }
  .bil-credit-lite-amount {
    text-align: left;
  }
  .bil-od-simple-controls {
    align-items: center;
    flex-wrap: nowrap;
    justify-content: flex-end;
    width: 100%;
  }
  .bil-od-mode-select {
    margin-right: auto;
  }
  .bil-credit-lite-controls {
    align-items: stretch;
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .bil-credit-history-top {
    align-items: stretch;
    flex-direction: column;
    gap: 12px;
  }
  .bil-credit-history-summary {
    align-items: baseline;
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .bil-credit-history-actions {
    align-items: center;
    flex-wrap: nowrap;
    justify-content: flex-end;
    width: 100%;
  }
  .bil-credit-history-input {
    margin-left: auto;
  }
  .bil-credit-history-meta {
    align-items: center;
    flex-direction: row;
  }
  .bil-credit-history-head {
    display: grid;
    font-size: var(--bil-fs-micro);
    padding: 10px 14px;
  }
  .bil-credit-history-head,
  .bil-credit-history-row {
    column-gap: 8px;
    grid-template-columns: minmax(74px, 0.95fr) minmax(92px, 1.1fr) minmax(72px, 0.75fr) minmax(58px, 0.6fr);
  }
  .bil-credit-history-row {
    font-size: var(--bil-fs-caption);
    padding: 12px 14px;
    row-gap: 0;
  }
  .bil-credit-history-row span,
  .bil-credit-history-row strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .bil-credit-history-row strong {
    justify-self: end;
    text-align: right;
  }
  .bil-credit-history-row span:nth-child(2) {
    color: #374151;
  }
  .bil-od-simple-row--controls .bil-od-simple-copy {
    flex: 1 1 auto;
    max-width: none;
  }
  .bil-od-controls {
    flex-direction: column;
    align-items: stretch;
  }
  .bil-pp-config-row {
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }
  .bil-credits-header,
  .bil-credits-subhead {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }
  .bil-credits-available {
    justify-items: start;
    text-align: left;
  }
  .bil-credits-available strong,
  .bil-od-amount,
  .bil-credits-subhead strong {
    font-size: var(--bil-fs-amount-md);
    min-width: 0;
    text-align: left;
    white-space: normal;
  }
  .bil-prepurchase-row {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
  }
  .bil-prepurchase-toggle {
    justify-content: center;
  }
  .bil-pp-tiers {
    flex-wrap: wrap;
  }
  .bil-pp-tier-card {
    flex: 1 1 40%;
  }
  .bil-pp-checkout {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .bil-pp-checkout .bil-btn-cta {
    width: 100%;
  }
  .bil-od-footer {
    flex-direction: column;
    align-items: flex-start;
  }
  .bil-ledger-row {
    flex-direction: column;
    align-items: flex-start;
  }
  .bil-usage-notice {
    gap: 8px;
  }
}
/* ═══════════════════════════════════════════════════════
   End billing redesign
   ═══════════════════════════════════════════════════════ */
/* Account page entrance animation */
.modern-account.fade-in-fade-out {
  opacity: 1;
  transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
  --usage-plan-color: #428bca;
  --usage-prepaid-color: #38bdf8;
  --usage-cap-color: #10b981;
  --usage-plan-soft: #f4f8fc;
  --usage-prepaid-soft: #f4f8fc;
  --usage-cap-soft: #ecfdf5;
}
.modern-account.fade-in-fade-out.ng-enter {
  opacity: 0;
  transform: translateY(20px);
}
.modern-account.fade-in-fade-out.ng-enter-active {
  opacity: 1;
  transform: translateY(0);
}
/* Enhanced back arrow animation */
.back-arrow-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: absolute !important;
  top: 15px !important;
  left: 15px !important;
  z-index: 1000 !important;
  min-width: 48px !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  background-color: rgba(255, 255, 255, 0.9) !important;
  color: rgba(63, 81, 181, 0.9) !important;
  transition: all 0.3s ease !important;
  border: 1px solid rgba(63, 81, 181, 0.2) !important;
  opacity: 0;
  animation: fadeInLeft 2s cubic-bezier(0.23, 1, 0.32, 1) 0s forwards;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}
.back-arrow-button:hover {
  background-color: #ffffff !important;
  color: #3f51b5 !important;
  transform: scale(1.05) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}
.back-arrow-button md-icon {
  font-size: 24px !important;
  width: 24px !important;
  height: 24px !important;
  line-height: 24px !important;
}
/* Keyframe for back arrow */
@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translateX(-20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
/* Hide chrome only while account view is mounted. This file is imported in main.less globally;
   unqualified `navbar { display:none }` would hide the navbar on every route. */
body:has(#account-form-container) navbar {
  display: none !important;
}
body:has(#account-form-container) footer {
  display: none !important;
}
body:has(#account-form-container) main {
  padding: 0 !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
}
/* Background - original gradient */
#account-form-container {
  min-height: 100vh !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  background: radial-gradient(1200px 640px at 20% -10%, rgba(154, 184, 255, 0.35), transparent 60%), radial-gradient(900px 620px at 95% 15%, rgba(167, 137, 255, 0.28), transparent 65%), linear-gradient(135deg, #4f6bd8 0%, #6a5ac9 60%, #5f4ebb 100%);
  position: relative;
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
/* Account card */
.account-card {
  width: 100% !important;
  max-width: 640px !important;
  border-radius: 12px !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  overflow: hidden;
  background: #fff !important;
  animation: cardEnter 0.5s ease-out forwards !important;
  margin: 0 auto !important;
}
.account-shell-wrap {
  width: 100%;
  max-width: 1180px;
  padding: 36px 24px;
  box-sizing: border-box;
}
.account-settings-shell.account-card {
  width: 100% !important;
  max-width: 1180px !important;
  height: calc(100vh - 72px);
  max-height: 880px;
  min-height: 620px;
  border-radius: 14px !important;
  border-color: rgba(226, 232, 240, 0.9) !important;
  background: #fff !important;
  overflow: hidden;
  box-shadow: 0 22px 70px rgba(15, 23, 42, 0.2) !important;
}
.account-settings-layout {
  display: grid;
  grid-template-columns: 292px minmax(0, 1fr);
  width: 100%;
  height: 100%;
  min-height: 0;
}
.account-settings-sidebar {
  min-width: 0;
  padding: 28px 20px;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border-right: 1px solid #e2e8f0;
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.account-sidebar-brand .account-icon {
  margin: 0 0 12px;
}
.account-sidebar-brand .account-title {
  font-size: 24px !important;
  line-height: 1.12 !important;
  text-align: left !important;
  margin: 0 0 6px !important;
  letter-spacing: 0 !important;
}
.account-sidebar-brand .account-subtitle {
  max-width: 230px;
  color: #64748b !important;
  line-height: 1.45;
  text-align: left !important;
}
.account-sidebar-user {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid #e2e8f0;
  border-radius: 10px;
}
.account-avatar {
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #334155;
  color: #fff;
  font-size: 18px;
  font-weight: 650;
}
.account-sidebar-user-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.account-sidebar-user-copy strong,
.account-sidebar-user-copy span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.account-sidebar-user-copy strong {
  color: #0f172a;
  font-size: 15px;
  font-weight: 650;
}
.account-sidebar-user-copy span {
  color: #64748b;
  font-size: 12px;
}
.account-settings-sidebar .account-tabs {
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
}
.account-settings-sidebar .account-tab {
  width: 100%;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  padding: 12px 12px;
  border-radius: 8px;
  text-align: left;
  color: #475569;
}
.account-settings-sidebar .account-tab md-icon {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  font-size: 20px !important;
  line-height: 20px !important;
  color: currentColor !important;
  margin: 0px;
}
.account-settings-sidebar .account-tab span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.account-settings-sidebar .account-tab:hover {
  background: #e8eef7;
  color: #243552;
}
.account-settings-sidebar .account-tab.active {
  background: #fff;
  color: #0f172a;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}
.account-settings-main {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #fff;
}
.account-settings-main-head {
  flex: 0 0 auto;
  padding: 34px 40px 18px;
}
.account-settings-eyebrow {
  margin: 0 0 10px;
  color: #64748b;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0;
}
.account-settings-main-title {
  margin: 0;
  color: #0f172a;
  font-size: 36px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: 0;
}
.account-settings-main-head .account-panel-subtitle {
  margin: 14px 0 0;
  max-width: 680px;
}
.account-settings-content {
  min-height: 0;
  overflow-y: auto;
  padding: 0 40px 44px;
}
.account-settings-content .account-section {
  max-width: 760px;
}
@keyframes cardEnter {
  from {
    opacity: 0;
    transform: translateY(24px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
/* Account header styling */
.account-header {
  padding: 36px 28px 20px !important;
  background: transparent !important;
  border-bottom: none !important;
}
.account-icon {
  width: 48px;
  height: 48px;
  margin: 0 auto 10px;
  border-radius: 10px;
  background: #334155;
  display: flex;
  align-items: center;
  justify-content: center;
}
.account-icon md-icon {
  font-size: 26px !important;
  width: 26px !important;
  height: 26px !important;
  color: white !important;
}
.account-title {
  font-size: 32px !important;
  font-weight: 650 !important;
  color: #1a2b42 !important;
  margin: 0 0 4px !important;
  text-align: center !important;
  letter-spacing: -0.02em;
}
.account-subtitle {
  font-size: 13px !important;
  color: #647896 !important;
  margin: 0 !important;
  text-align: center !important;
  font-weight: 400 !important;
}
.account-tabs {
  display: flex;
  flex-wrap: nowrap;
  width: 100%;
  margin: 0 0 16px 0;
  padding: 4px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  gap: 4px;
}
.account-tab {
  flex: 1 1 0;
  min-width: 0;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: #4a5f7d;
  font-size: 13px;
  font-weight: 600;
  padding: 11px 12px;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
  text-align: center;
  letter-spacing: 0.01em;
}
.account-tab:hover {
  background: #e2e8f4;
  color: #243552;
}
.account-tab.active {
  background: #fff;
  color: #0f172a;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}
.account-panel-subtitle {
  font-size: 14px;
  color: #6b7f99;
  margin-bottom: 16px;
  display: flex;
  flex-direction: column;
}
.subtitle-credit-note {
  display: inline;
  font-size: 12px;
  color: #94a3b8;
  font-style: italic;
}
/* Section styling */
.account-section {
  margin-bottom: 16px;
  padding-bottom: 0;
  border-bottom: none;
}
.account-section:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
}
.account-section .b-sub-card {
  margin-bottom: 10px;
}
.account-section .b-sub-card:last-child {
  margin-bottom: 0;
}
/* Profile/Security panel cards – same language as Usage/Billing */
.account-panel-card {
  position: relative;
  padding: 14px 16px 16px;
}
.account-panel-card .b-sub-title {
  margin-bottom: 12px;
  padding-bottom: 0;
}
.account-panel-card .section-description {
  margin-bottom: 12px;
}
.account-panel-card .input-wrapper {
  border: 1.5px solid #e2e8f0;
  border-radius: 7px;
  background: #f8fafc;
}
.account-panel-card .input-wrapper.input-focus {
  border-color: #36465d;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(54, 70, 93, 0.1);
}
.account-panel-card .input-wrapper.input-error {
  border-color: #ef4444;
  background: #fef2f2;
}
.account-panel-card .alert {
  border-radius: 10px;
}
.security-activity-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.security-refresh-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  color: #64748b;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 7px;
  cursor: pointer;
}
.security-refresh-btn:hover:not([disabled]) {
  color: #36465d;
  border-color: rgba(54, 70, 93, 0.35);
}
.security-refresh-btn[disabled] {
  opacity: 0.55;
  cursor: default;
}
.security-refresh-btn md-icon {
  margin: 0;
  font-size: 18px;
  width: 18px;
  height: 18px;
  line-height: 18px;
}
.security-activity-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 84px;
}
.security-activity-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.security-activity-item {
  min-width: 0;
  padding: 12px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 7px;
}
.security-activity-item strong,
.security-activity-item span {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}
.security-activity-item strong {
  margin: 4px 0;
  color: #0f172a;
  font-size: 13px;
  font-weight: 700;
}
.security-activity-item span {
  color: #64748b;
  font-size: 12px;
}
.security-activity-label {
  color: #94a3b8 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase;
}
.security-revoke-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  border-radius: 7px;
}
.security-revoke-box strong {
  display: block;
  color: #9a3412;
  font-size: 13px;
  font-weight: 700;
}
.security-revoke-box p {
  margin: 4px 0 0;
  color: #9a3412;
  font-size: 12px;
  line-height: 1.45;
}
.account-secondary-danger-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 8px 12px;
  color: #b91c1c;
  background: #fff;
  border: 1px solid #fecaca;
  border-radius: 7px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
}
.account-secondary-danger-btn:hover:not([disabled]) {
  background: #fef2f2;
  border-color: #fca5a5;
}
.account-secondary-danger-btn[disabled] {
  opacity: 0.6;
  cursor: default;
}
.account-primary-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 44px;
  padding: 10px 18px;
  font-size: 13px;
  font-weight: 600;
  font-family: inherit;
  color: #fff;
  background: linear-gradient(135deg, #36465d, #428bca);
  border: none;
  border-radius: 7px;
  cursor: pointer;
  transition: transform 0.1s ease, box-shadow 0.15s ease, filter 0.15s ease;
  letter-spacing: -0.01em;
  margin-top: 8px;
}
.account-primary-btn:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(54, 70, 93, 0.35);
  filter: brightness(1.05);
}
.account-primary-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.account-danger-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 44px;
  padding: 10px 18px;
  font-size: 13px;
  font-weight: 600;
  font-family: inherit;
  color: #fff;
  background: #dc2626;
  border: none;
  border-radius: 7px;
  cursor: pointer;
  transition: background 0.15s ease, transform 0.1s ease;
  margin-top: 8px;
}
.account-danger-btn:hover:not(:disabled) {
  background: #b91c1c;
  transform: translateY(-1px);
}
.account-danger-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.account-cancel-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 18px;
  font-size: 13px;
  font-weight: 600;
  font-family: inherit;
  color: #64748b;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 7px;
  cursor: pointer;
  transition: background 0.15s ease;
}
.account-cancel-btn:hover:not(:disabled) {
  background: #e2e8f0;
  color: #475569;
}
.form-actions--row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.form-actions--row .account-danger-btn,
.form-actions--row .account-cancel-btn {
  flex: 1 1 auto;
  min-width: 120px;
  margin-top: 0;
}
.section-title {
  font-size: 16px;
  font-weight: 600;
  color: #0f172a;
  margin: 0 0 10px 0;
  letter-spacing: -0.01em;
}
.section-description {
  font-size: 14px;
  color: #64748b;
  margin: 0 0 12px 0;
}
/* ── Skeleton shimmer placeholders ── */
@keyframes skeletonShimmer {
  0% {
    background-position: -400px 0;
  }
  100% {
    background-position: 400px 0;
  }
}
.skel {
  background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 37%, #f1f5f9 63%);
  background-size: 800px 100%;
  animation: skeletonShimmer 1.6s ease-in-out infinite;
  border-radius: 6px;
}
.skel-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  overflow: hidden;
}
.skel-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 18px 16px 16px;
}
.skel-row-between {
  justify-content: space-between;
}
.skel-block {
  display: block;
}
.skel-line {
  height: 12px;
}
.skel-line-lg {
  height: 28px;
}
.skel-line-sm {
  height: 8px;
}
.skel-bar-track {
  height: 6px;
  margin: 12px 16px 0;
  border-radius: 999px;
}
.skel-bar-caption {
  height: 8px;
  width: 72px;
  margin: 10px 16px 6px;
  border-radius: 4px;
}
.skel-stats {
  display: flex;
  border-top: 1px solid #f1f5f9;
  margin-top: 16px;
}
.skel-stat {
  flex: 1 1 0;
  padding: 14px 16px;
  border-right: 1px solid #f1f5f9;
}
.skel-stat:last-child {
  border-right: none;
}
.skel-stat-label {
  height: 8px;
  width: 52px;
  margin-bottom: 8px;
  border-radius: 4px;
}
.skel-stat-value {
  height: 16px;
  width: 60px;
  margin-bottom: 6px;
  border-radius: 4px;
}
.skel-stat-sub {
  height: 8px;
  width: 48px;
  border-radius: 4px;
}
/* breakdown skeleton */
.skel-breakdown {
  margin-top: 14px;
}
.skel-breakdown-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  border-bottom: 1px solid #f1f5f9;
}
.skel-breakdown-kpis {
  display: flex;
  border-bottom: 1px solid #f1f5f9;
}
.skel-breakdown-kpi {
  flex: 1 1 0;
  padding: 12px 16px;
  border-right: 1px solid #f1f5f9;
}
.skel-breakdown-kpi:last-child {
  border-right: none;
}
.skel-chart-bars {
  display: flex;
  align-items: flex-end;
  gap: 3px;
  height: 100px;
  padding: 12px 12px 14px;
}
.skel-chart-col {
  flex: 1 1 0;
  border-radius: 4px 4px 1px 1px;
}
.skel-chart-axis {
  display: flex;
  justify-content: space-between;
  padding: 8px 12px 12px;
}
/* billing skeleton extras */
.skel-chip {
  height: 22px;
  width: 62px;
  border-radius: 999px;
}
.skel-sub-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px;
}
.skel-btn {
  height: 34px;
  width: 140px;
  border-radius: 7px;
}
.skel-hint {
  height: 10px;
  width: 120px;
  border-radius: 4px;
}
/* addon skeleton */
.skel-addon-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 16px;
  border-bottom: 1px solid #f1f5f9;
}
.skel-addon-tiers {
  display: flex;
  border-bottom: 1px solid #f1f5f9;
}
.skel-addon-tier {
  flex: 1 1 0;
  padding: 14px 8px;
  border-right: 1px solid #f1f5f9;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.skel-addon-tier:last-child {
  border-right: none;
}
.skel-addon-checkout {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
}
/* ── Usage + Billing shared ── */
.u-loading {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  color: #64748b;
  font-size: 13px;
}
.u-bar-track {
  height: 6px;
  margin: 16px 0px;
  border-radius: 999px;
  background: #f1f5f9;
  overflow: hidden;
  position: relative;
}
.u-bar-fill {
  height: 100%;
  border-radius: inherit;
  position: absolute;
  top: 0;
  transition: width 300ms ease;
}
.u-bar-fill--plan {
  left: 0;
  background: linear-gradient(90deg, var(--usage-plan-color) 0%, #7aadda 100%);
}
.u-bar-fill--addon {
  background: linear-gradient(90deg, #0ea5e9 0%, var(--usage-prepaid-color) 100%);
}
.u-bar-legend {
  display: flex;
  gap: 14px;
  margin-bottom: 8px;
}
.u-bar-legend-item {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 10px;
  color: #94a3b8;
  font-weight: 500;
}
.u-bar-legend-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.u-bar-legend-dot--plan {
  background: #428bca;
}
.u-bar-legend-dot--addon {
  background: #38bdf8;
}
/* ── Breakdown chart card ── */
.u-breakdown {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  margin-top: 14px;
  overflow: hidden;
}
.u-breakdown-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 14px 16px;
  border-bottom: 1px solid #f1f5f9;
}
.u-breakdown-head h4 {
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.02em;
}
.u-breakdown-select {
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 500;
  color: #334155;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  outline: none;
  cursor: pointer;
  font-family: inherit;
}
.u-breakdown-select:focus {
  border-color: #36465d;
  box-shadow: 0 0 0 2px rgba(54, 70, 93, 0.1);
}
.u-breakdown-kpis {
  display: flex;
  border-bottom: 1px solid #f1f5f9;
}
.u-breakdown-kpi {
  flex: 1 1 0;
  padding: 12px 16px;
  border-right: 1px solid #f1f5f9;
}
.u-breakdown-kpi:last-child {
  border-right: none;
}
.u-breakdown-kpi span {
  display: block;
  font-size: 10px;
  font-weight: 600;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 2px;
}
.u-breakdown-kpi strong {
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
}
.u-chart {
  height: 120px;
  padding: 12px 12px 14px;
}
.u-chart-empty {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
  font-size: 12px;
}
.u-chart-bars {
  height: 100%;
  display: flex;
  align-items: flex-end;
  gap: 3px;
}
.u-chart-col {
  flex: 1 1 0;
  height: 100%;
  display: flex;
  align-items: flex-end;
}
.u-chart-bar {
  width: 100%;
  min-height: 2px;
  border-radius: 4px 4px 1px 1px;
  background: linear-gradient(180deg, #428bca 0%, #36465d 100%);
  transition: height 200ms ease;
}
.u-chart-bar.is-future {
  background: #e2e8f0;
}
.u-chart-axis {
  display: flex;
  justify-content: space-between;
  padding: 8px 12px 12px;
  font-size: 11px;
  color: #94a3b8;
}
/* access warning */
.u-alert {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 10px;
  padding: 12px 14px;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 10px;
  color: #92400e;
  font-size: 13px;
  line-height: 1.45;
}
.u-alert md-icon {
  font-size: 18px !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  color: #d97706 !important;
  margin: 0px;
}
.u-alert strong {
  display: block;
  font-weight: 600;
  margin-bottom: 4px;
}
.u-alert p {
  margin: 0;
}
.u-alert-btn {
  margin-top: 8px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 600;
  font-family: inherit;
  color: #fff;
  background: #d97706;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.15s;
}
.u-alert-btn:hover {
  background: #b45309;
}
.u-policy {
  margin-bottom: 16px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid #ddeaf5;
  background: #f8fbff;
}
.u-policy h5 {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 700;
  color: #1e3a8a;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.u-policy ul {
  margin: 0;
  padding-left: 16px;
  display: grid;
  gap: 5px;
  color: #334155;
  font-size: 12px;
  line-height: 1.45;
}
.u-period-note {
  margin-top: 12px;
  font-size: 12px;
  color: #94a3b8;
}
/* ── Billing: subscription card ── */
.b-sub-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 16px;
}
.b-sub-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 16px;
  border-bottom: 1px solid #f1f5f9;
}
.b-sub-top-left {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.b-sub-top-single {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.b-sub-top-timeline {
  min-width: 0;
}
.b-sub-title {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -0.02em;
}
.b-sub-interval {
  font-size: 12px;
  font-weight: 500;
  color: #94a3b8;
}
.b-sub-renewal {
  display: block;
  font-size: 11px;
  font-weight: 500;
  color: #94a3b8;
  margin-top: 2px;
}
.b-sub-chip {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
}
.b-sub-chip-link {
  display: inline-flex;
  align-items: center;
  border: none;
  background: transparent;
  color: #36465d;
  font-size: 13px;
  font-weight: 600;
  text-decoration: underline;
  cursor: pointer;
  padding: 0;
}
.b-sub-chip-link:hover:not(:disabled) {
  color: #36465d;
}
.b-sub-chip-link:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  text-decoration: none;
}
.b-sub-chip.is-ok {
  color: #166534;
  background: #dcfce7;
}
.b-sub-chip.is-warning {
  color: #92400e;
  background: #fef3c7;
}
.b-sub-breakdown {
  border-bottom: 1px solid #f1f5f9;
  padding: 0 16px;
}
.b-sub-breakdown-head {
  padding: 16px 0 12px;
}
.b-sub-breakdown-kicker {
  display: block;
  margin-bottom: 5px;
  font-size: 10px;
  font-weight: 700;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.b-sub-breakdown-head h5 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.02em;
}
.b-sub-breakdown-head p {
  margin: 6px 0 0;
  max-width: 560px;
  font-size: 12px;
  line-height: 1.55;
  color: #64748b;
}
.b-sub-breakdown-list {
  display: grid;
}
.b-sub-breakdown-row {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(220px, 1fr);
  gap: 18px;
  padding: 16px 0;
  border-top: 1px solid #f1f5f9;
}
.b-sub-breakdown-row:first-child {
  border-top: none;
}
.b-sub-breakdown-main {
  min-width: 0;
  display: grid;
  gap: 6px;
}
.b-sub-breakdown-label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  color: #334155;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.b-sub-breakdown-copy {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
  color: #64748b;
}
.b-sub-breakdown-link {
  width: fit-content;
  padding: 0;
  border: none;
  background: transparent;
  font-size: 13px;
  font-weight: 600;
  color: #36465d;
  cursor: pointer;
  transition: color 0.12s ease;
}
.b-sub-breakdown-link:hover {
  color: #36465d;
  text-decoration: underline;
}
.b-sub-breakdown-metric {
  display: grid;
  gap: 4px;
  align-content: start;
  justify-items: end;
  text-align: right;
}
.b-sub-breakdown-metric strong {
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
  letter-spacing: -0.02em;
}
.b-sub-breakdown-metric em {
  font-style: normal;
  font-size: 12px;
  color: #64748b;
}
.b-sub-breakdown-metric span {
  font-size: 11px;
  color: #94a3b8;
  line-height: 1.45;
}
@media (max-width: 900px) {
  .b-sub-breakdown-row {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .b-sub-breakdown-metric {
    justify-items: start;
    text-align: left;
  }
}
.b-sub-stat-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}
.b-sub-stat-dot--plan {
  background: var(--usage-plan-color);
}
.b-sub-stat-dot--cap {
  background: var(--usage-cap-color);
}
.b-sub-stat-dot--prepaid {
  background: var(--usage-prepaid-color);
}
/* ── Billing: credits hero (total remaining + bar) ── */
.b-credits-hero {
  display: block;
  padding: 16px 16px 14px;
  border-bottom: 1px solid #f1f5f9;
}
.b-credits-hero-left {
  min-width: 0;
}
.b-credits-total {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 3px;
}
.b-credits-total-num {
  font-size: 28px;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -0.03em;
  line-height: 1;
  margin-top: -3px;
}
.b-credits-total-label {
  font-size: 13px;
  font-weight: 600;
  color: #64748b;
}
.b-credits-used-line {
  font-size: 11px;
  color: #94a3b8;
  margin-bottom: 10px;
}
.b-credits-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}
.b-credits-hero-left {
  flex: 1 1 auto;
  min-width: 0;
}
.b-credits-hero-right {
  flex-shrink: 0;
  display: grid;
  gap: 6px;
  justify-items: end;
  text-align: right;
}
.b-usage-summary-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #94a3b8;
}
.b-usage-summary-value {
  font-size: 28px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: -0.04em;
  font-variant-numeric: tabular-nums;
  color: #0f172a;
}
.u-bar-track--stacked {
  margin: 18px 0 22px;
  height: 10px;
  background: #edf2f8;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
}
.u-bar-fill--prepaid {
  background: linear-gradient(90deg, #36b5ef 0%, #64d2ff 100%);
}
.u-bar-fill--ondemand {
  background: linear-gradient(90deg, #19b97d 0%, #4dd5a1 100%);
}
.b-usage-rails {
  display: grid;
  gap: 14px;
}
.b-usage-rail {
  display: grid;
  gap: 9px;
}
.b-usage-rail-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
}
.b-usage-rail-label {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  font-size: 13px;
  font-weight: 600;
  color: #52637d;
  letter-spacing: -0.01em;
}
.b-usage-rail-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  flex-shrink: 0;
  box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.9);
}
.b-usage-rail-dot--plan {
  background: #428bca;
}
.b-usage-rail-dot--prepaid {
  background: #38bdf8;
}
.b-usage-rail-dot--ondemand {
  background: #10b981;
}
.b-usage-rail-value {
  flex-shrink: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
  color: #0f172a;
}
.b-usage-rail-track {
  position: relative;
  width: 100%;
  height: 8px;
  border-radius: 999px;
  background: #edf2f8;
  overflow: hidden;
}
.b-usage-rail-fill {
  position: absolute;
  inset: 0 auto 0 0;
  height: 100%;
  border-radius: inherit;
  transition: width 300ms ease;
}
.b-usage-rail-fill--plan {
  background: linear-gradient(90deg, #5b5cf0 0%, #7e83ff 100%);
}
.b-usage-rail-fill--prepaid {
  background: linear-gradient(90deg, #2fb6f6 0%, #68d4ff 100%);
}
.b-usage-rail-fill--ondemand {
  background: linear-gradient(90deg, #14b979 0%, #49d79f 100%);
}
.b-sub-timeline {
  display: flex;
  align-items: center;
  gap: 0;
}
.b-sub-tl-node {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-shrink: 0;
}
.b-sub-tl-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.b-sub-tl-node.is-now .b-sub-tl-dot {
  background: #36465d;
  box-shadow: 0 0 0 3px rgba(54, 70, 93, 0.15);
}
.b-sub-tl-node.is-next .b-sub-tl-dot {
  background: #d1d5db;
  box-shadow: 0 0 0 3px rgba(209, 213, 219, 0.2);
}
.b-sub-tl-plan {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.b-sub-tl-node.is-now .b-sub-tl-plan {
  color: #0f172a;
}
.b-sub-tl-node.is-next .b-sub-tl-plan {
  color: #64748b;
}
.b-sub-tl-meta {
  font-size: 11px;
  font-weight: 500;
  color: #94a3b8;
}
.b-sub-tl-line {
  flex: 1;
  height: 1px;
  min-width: 24px;
  margin: 0 10px;
  background: repeating-linear-gradient(90deg, #cbd5e1 0, #cbd5e1 4px, transparent 4px, transparent 8px);
}
.b-sub-policy {
  margin: 16px 16px 0px 16px;
  padding: 12px 14px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}
.b-sub-policy h5 {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 700;
  color: #334155;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.b-sub-policy ul {
  margin: 0;
  padding-left: 16px;
  display: grid;
  gap: 6px;
  color: #334155;
  font-size: 12px;
  line-height: 1.45;
}
.b-sub-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 16px;
}
.b-sub-footer-actions {
  display: flex;
  align-items: center;
  gap: 16px;
}
.b-sub-link {
  font-size: 13px;
  font-weight: 500;
  color: #36465d;
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.12s ease;
}
.b-sub-link:hover {
  color: #36465d;
  text-decoration: underline;
}
.b-manage-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 7px 14px;
  font-size: 13px;
  font-weight: 600;
  font-family: inherit;
  color: #36465d;
  background: #f4f8fc;
  border: 1px solid #ddeaf5;
  border-radius: 7px;
  cursor: pointer;
  transition: all 0.12s ease;
  white-space: nowrap;
  margin-left: 0px;
}
.b-manage-btn:hover:not(:disabled) {
  background: #ddeaf5;
  color: #36465d;
}
.b-manage-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.b-manage-btn span {
  font-size: 14px;
  display: inline;
  text-transform: none;
  letter-spacing: 0;
  color: inherit;
}
.b-cancel-downgrade-link {
  display: block;
  margin: 10px 0 0 auto;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  font-family: inherit;
  font-size: 12px;
  font-weight: 500;
  color: #94a3b8;
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color 0.15s ease;
}
.b-cancel-downgrade-link:hover:not(:disabled) {
  color: #36465d;
}
.b-cancel-downgrade-link:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.b-sub-hint {
  font-size: 12px;
  color: #94a3b8;
}
.b-sub-hint a {
  color: #36465d;
  text-decoration: none;
}
.b-sub-hint a:hover {
  text-decoration: underline;
}
.b-sub-warn {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0 16px 16px;
  padding: 12px 14px;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 8px;
  color: #92400e;
  font-size: 12px;
  line-height: 1.4;
}
.b-sub-warn .material-icons {
  font-size: 16px;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin-top: 1px;
}
.b-sub-warn strong {
  font-weight: 600;
}
.billing-controls-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.billing-action-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 4px;
}
.billing-action-button.modern-submit.md-button {
  width: auto !important;
  flex: 1 1 165px;
  height: 42px !important;
  margin: 0 !important;
  border-radius: 10px !important;
  font-size: 14px !important;
}
.billing-action-secondary.modern-submit.md-primary.md-button {
  background: #e7eef9 !important;
  color: #2f4771 !important;
}
.billing-action-secondary.modern-submit.md-primary.md-button:hover,
.billing-action-secondary.modern-submit.md-primary.md-button:focus {
  background: #dae5f5 !important;
}
.billing-action-ghost.modern-submit.md-primary.md-button {
  background: #f4f7fc !important;
  color: #435b78 !important;
}
.billing-action-ghost.modern-submit.md-primary.md-button:hover,
.billing-action-ghost.modern-submit.md-primary.md-button:focus {
  background: #e8eef8 !important;
}
.billing-table-wrap {
  border: 1px solid #dfe8f6;
  border-radius: 10px;
  overflow: hidden;
}
.billing-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.billing-table thead th {
  text-align: left;
  padding: 10px 11px;
  color: #5c708c;
  background: #f6f9ff;
  border-bottom: 1px solid #e2eaf7;
  font-weight: 650;
}
.billing-table tbody td {
  padding: 10px 11px;
  color: #243752;
  border-bottom: 1px solid #ecf1fa;
  vertical-align: middle;
}
.billing-table tbody tr:last-child td {
  border-bottom: none;
}
/* Invoice history AG Grid – elegant table */
.billing-invoice-grid-wrap {
  border: 1px solid #dfe8f6;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 12px;
}
.billing-invoice-grid-wrap.ag-theme-alpine {
  --ag-header-background-color: #f6f9ff;
  --ag-header-foreground-color: #4a5f7f;
  --ag-row-hover-color: #f8fbff;
  --ag-border-color: #e2eaf7;
  --ag-font-size: 13px;
}
.billing-invoice-grid-wrap .ag-header-cell {
  font-weight: 600;
  letter-spacing: 0.02em;
}
.billing-invoice-grid-wrap .ag-cell {
  line-height: 1.35;
}
.billing-invoice-grid-wrap .invoice-view-link {
  color: #3f78d8;
  text-decoration: none;
  font-weight: 500;
}
.billing-invoice-grid-wrap .invoice-view-link:hover {
  text-decoration: underline;
}
.billing-invoices-load-more {
  margin-top: 10px;
}
.billing-invoices-load-more .btn {
  border-radius: 10px;
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 600;
  border: 1px solid #d9e4f3;
  background: #f4f7fc;
  color: #2f4771;
  transition: background 0.2s, border-color 0.2s;
}
.billing-invoices-load-more .btn:hover:not(:disabled) {
  background: #e8eef8;
  border-color: #c5d4ed;
}
.billing-mini-status {
  display: inline-flex;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 650;
  padding: 3px 9px;
  text-transform: capitalize;
}
.billing-mini-status.is-success {
  color: #166534;
  background: #dcfce7;
}
.billing-mini-status.is-pending {
  color: #8a4b08;
  background: #fff4df;
}
.billing-mini-status.is-neutral {
  color: #445b79;
  background: #e8eef9;
}
/* ── On-Demand Credits card ── */
.addon-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  margin-top: 18px;
  box-shadow: none;
}
.addon-card--policy {
  border-color: #dfe8f6;
  background: #ffffff;
}
.addon-policy-shell {
  display: grid;
  gap: 16px;
  padding: 20px;
}
.addon-policy-head {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.addon-policy-copy {
  display: grid;
  gap: 8px;
}
.addon-policy-eyebrow {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 0;
  border-radius: 0;
  background: transparent;
  border: none;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #94a3b8;
}
.addon-policy-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.addon-card--policy .addon-title {
  font-size: 19px;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.addon-policy-status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: -0.01em;
  border: 1px solid #e2e8f0;
}
.addon-policy-status-pill.is-disabled {
  background: #f8fafc;
  color: #475569;
  border-color: #e2e8f0;
}
.addon-policy-status-pill.is-fixed {
  background: #f4f8fc;
  color: #36465d;
  border-color: #cadff0;
}
.addon-policy-status-pill.is-unlimited {
  background: #ecfdf3;
  color: #047857;
  border-color: #bbf7d0;
}
.addon-policy-description {
  margin: 0;
  max-width: 720px;
  font-size: 14px;
  line-height: 1.6;
  color: #64748b;
}
.addon-policy-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.addon-policy-badge {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 11px;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  color: #334155;
  font-size: 12px;
  font-weight: 600;
  box-shadow: none;
}
.addon-policy-note {
  font-size: 12px;
  color: #94a3b8;
  line-height: 1.6;
}
/* -- top bar: title + price + equivalences -- */
.addon-top {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px 16px 14px;
  border-bottom: 1px solid #f1f5f9;
}
.addon-top-left {
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.addon-title {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.02em;
}
.addon-price-tag {
  font-size: 15px;
  font-weight: 700;
  color: #36465d;
  letter-spacing: -0.01em;
}
.addon-price-tag small {
  font-size: 11px;
  font-weight: 500;
  color: #94a3b8;
  margin-left: 1px;
}
.addon-top-right {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.addon-equiv {
  font-size: 11px;
  font-weight: 500;
  color: #64748b;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 5px;
  padding: 3px 8px;
  white-space: nowrap;
}
.addon-equiv-note {
  font-size: 9px;
  color: #94a3b8;
  font-style: italic;
  white-space: nowrap;
}
.addon-usage-breakout {
  padding: 18px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #ffffff;
}
.addon-usage-breakout--policy {
  box-shadow: none;
}
.addon-usage-breakout-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
}
.addon-usage-breakout-copy {
  display: grid;
  gap: 6px;
}
.addon-usage-breakout-kicker {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
}
.addon-usage-breakout-value {
  display: block;
  font-size: 20px;
  line-height: 1;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.02em;
}
.addon-usage-breakout-side {
  max-width: 280px;
  text-align: right;
  font-size: 12px;
  line-height: 1.55;
  color: #64748b;
}
.addon-policy-bar-track {
  height: 8px;
  margin: 14px 0 12px;
  background: #e8eef5;
}
.addon-policy-legend {
  margin-bottom: 0;
}
.addon-policy-section {
  display: grid;
  gap: 12px;
}
.addon-policy-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.addon-policy-section-head--tight {
  align-items: center;
}
.addon-policy-section-label {
  display: block;
  margin-bottom: 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
}
.addon-policy-section-copy {
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
  color: #64748b;
}
.addon-policy-section-aside {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  font-size: 11px;
  font-weight: 600;
  color: #475569;
  white-space: nowrap;
}
/* -- tier selector strip -- */
.addon-tiers {
  display: flex;
  gap: 0;
  padding: 0;
  border-bottom: 1px solid #f1f5f9;
}
.addon-tier {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  padding: 14px 8px;
  border: none;
  border-right: 1px solid #f1f5f9;
  background: transparent;
  cursor: pointer;
  transition: background 0.12s ease, color 0.12s ease;
  position: relative;
}
.addon-tier:last-child {
  border-right: none;
}
.addon-tier strong {
  font-size: 15px;
  font-weight: 700;
  color: #334155;
  transition: color 0.12s ease;
}
.addon-tier em {
  font-style: normal;
  font-size: 11px;
  font-weight: 500;
  color: #94a3b8;
  transition: color 0.12s ease;
}
.addon-tier:hover:not(:disabled):not(.is-active) {
  background: #f8fafc;
}
.addon-tier.is-active {
  background: #36465d !important;
}
.addon-tier.is-active strong {
  color: #fff !important;
}
.addon-tier.is-active em {
  color: rgba(255, 255, 255, 0.7) !important;
}
.addon-tier:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.addon-tiers--mode {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  padding: 0;
  border-bottom: none;
}
.addon-tier--mode {
  align-items: flex-start;
  text-align: left;
  gap: 6px;
  padding: 16px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: none;
}
.addon-tier--mode strong {
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
}
.addon-tier--mode em {
  font-size: 12px;
  line-height: 1.5;
  color: #64748b;
}
.addon-tier--mode:hover:not(:disabled):not(.is-active) {
  background: #fafcff;
  border-color: #cbd5e1;
  box-shadow: none;
}
.addon-tier--mode.is-active {
  background: #f4f8fc !important;
  border-color: #cadff0;
  box-shadow: none;
}
.addon-tier--mode.is-active strong {
  color: #3730a3 !important;
}
.addon-tier--mode.is-active em {
  color: #428bca !important;
}
.addon-policy-fixed-panel {
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
  box-shadow: none;
}
.addon-tiers--suggestions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 0;
  border-bottom: none;
}
.addon-tier--suggestion {
  gap: 4px;
  padding: 14px 8px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #ffffff;
}
.addon-tier--suggestion strong {
  font-size: 16px;
  color: #0f172a;
}
.addon-tier--suggestion em {
  font-size: 11px;
  color: #94a3b8;
}
.addon-tier--suggestion:hover:not(:disabled):not(.is-active) {
  background: #f8fafc;
  border-color: #cbd5e1;
}
.addon-tier--suggestion.is-active {
  background: #f4f8fc !important;
  border-color: #cadff0;
  box-shadow: none;
}
.addon-tier--suggestion.is-active strong {
  color: #3730a3 !important;
}
.addon-tier--suggestion.is-active em {
  color: #428bca !important;
}
/* -- checkout strip: qty + total + buy -- */
.addon-checkout-strip {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 16px;
}
.addon-checkout-strip--policy {
  padding: 0;
  gap: 16px;
  align-items: flex-end;
  flex-wrap: wrap;
}
.addon-qty-group {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.addon-qty-input {
  width: 64px;
  padding: 8px 6px;
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
  background: #f8fafc;
  border: 1.5px solid #e2e8f0;
  border-radius: 7px;
  outline: none;
  text-align: center;
  box-sizing: border-box;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  appearance: textfield;
  -moz-appearance: textfield;
}
.addon-qty-input::-webkit-inner-spin-button,
.addon-qty-input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.addon-qty-input:focus {
  border-color: #36465d;
  box-shadow: 0 0 0 3px rgba(54, 70, 93, 0.1);
  background: #fff;
}
.addon-qty-input--wide {
  width: 100%;
  max-width: none;
  min-width: 120px;
  padding: 0;
  border: none;
  background: transparent;
  text-align: left;
  box-shadow: none;
}
.addon-qty-input--wide:focus {
  border-color: transparent;
  box-shadow: none;
  background: transparent;
}
.addon-qty-hint {
  font-size: 12px;
  color: #94a3b8;
  font-weight: 500;
}
.addon-checkout-right {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-left: auto;
}
.addon-checkout-right--policy {
  gap: 14px;
  flex-shrink: 0;
}
.addon-total {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1px;
}
.addon-total-amount {
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.02em;
  line-height: 1;
}
.addon-total--policy {
  align-items: flex-end;
  gap: 5px;
}
.addon-savings {
  font-size: 11px;
  font-weight: 600;
  color: #16a34a;
}
.addon-policy-input-block {
  flex: 1 1 0;
  min-width: 0;
  display: grid;
  gap: 8px;
}
.addon-policy-input-label {
  font-size: 12px;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.01em;
}
.addon-policy-input-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid #dbe3ec;
  border-radius: 10px;
  background: #ffffff;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.addon-policy-input-wrap:focus-within {
  border-color: #36465d;
  box-shadow: 0 0 0 4px rgba(54, 70, 93, 0.1);
  background: #ffffff;
}
.addon-policy-currency {
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
}
.addon-policy-input-suffix {
  font-size: 12px;
  font-weight: 600;
  color: #94a3b8;
  white-space: nowrap;
}
.addon-policy-input-note {
  font-size: 12px;
  color: #64748b;
}
.addon-card--policy .addon-buy-btn {
  min-height: 44px;
  padding: 10px 20px;
  border-radius: 10px;
  background: linear-gradient(135deg, #36465d, #428bca);
  box-shadow: 0 6px 18px rgba(54, 70, 93, 0.2);
}
.addon-card--policy .addon-buy-btn:hover:not([disabled]) {
  box-shadow: 0 8px 20px rgba(54, 70, 93, 0.24);
  filter: brightness(1.03);
}
.addon-card--policy .addon-buy-btn:active:not([disabled]) {
  box-shadow: 0 2px 8px rgba(54, 70, 93, 0.16);
}
.addon-policy-save-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 18px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
}
.addon-policy-save-note {
  font-size: 12px;
  line-height: 1.5;
  color: #64748b;
  font-weight: 500;
}
.addon-policy-footer {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
.addon-policy-footer-copy {
  margin: 0;
  color: #94a3b8;
}
.addon-policy-clear {
  font-size: 13px;
  font-weight: 600;
  color: #36465d;
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.12s ease;
}
.addon-policy-clear:hover {
  color: #36465d;
  text-decoration: underline;
}
.addon-buy-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 18px;
  font-size: 13px;
  font-weight: 600;
  font-family: inherit;
  color: #fff;
  background: linear-gradient(135deg, #36465d, #428bca);
  border: none;
  border-radius: 7px;
  cursor: pointer;
  white-space: nowrap;
  transition: transform 0.1s ease, box-shadow 0.15s ease, filter 0.15s ease;
  letter-spacing: -0.01em;
}
.addon-buy-btn:hover:not([disabled]) {
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(54, 70, 93, 0.35);
  filter: brightness(1.05);
}
.addon-buy-btn:active:not([disabled]) {
  transform: translateY(0);
  box-shadow: 0 1px 4px rgba(54, 70, 93, 0.25);
}
.addon-buy-btn[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
}
/* Simplified on-demand policy card */
.addon-policy-shell {
  display: grid;
  gap: 18px;
  padding: 24px;
}
.addon-policy-summary {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
}
.addon-policy-summary-main {
  min-width: 0;
  display: grid;
  gap: 8px;
}
.addon-policy-eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #94a3b8;
}
.addon-card--policy .addon-title {
  font-size: 21px;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.addon-policy-description {
  margin: 0;
  max-width: 520px;
  font-size: 14px;
  line-height: 1.6;
  color: #64748b;
}
.addon-policy-summary-metric {
  flex-shrink: 0;
  display: grid;
  gap: 4px;
  justify-items: end;
  text-align: right;
}
.addon-policy-summary-caption {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #94a3b8;
}
.addon-policy-summary-value {
  font-size: 28px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: #0f172a;
}
.addon-policy-bar-track {
  height: 8px;
  margin: 0;
  background: #edf2f7;
}
.addon-policy-meta {
  margin: -4px 0 0;
  font-size: 13px;
  line-height: 1.5;
  color: #64748b;
}
.addon-policy-controls {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}
.addon-policy-control-copy {
  max-width: 340px;
  min-width: 0;
  display: grid;
  gap: 4px;
}
.addon-policy-section-label {
  display: block;
  margin: 0;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
}
.addon-policy-section-copy {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: #64748b;
}
.addon-policy-control-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}
.addon-policy-mode-picker {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #f8fafc;
}
.addon-policy-mode-option {
  border: none;
  background: transparent;
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 600;
  color: #64748b;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.addon-policy-mode-option.is-active {
  background: #ffffff;
  color: #0f172a;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}
.addon-policy-mode-option:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.addon-policy-fixed-inline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid #dbe3ec;
  border-radius: 12px;
  background: #ffffff;
}
.addon-policy-fixed-inline:focus-within {
  border-color: #36465d;
  box-shadow: 0 0 0 3px rgba(54, 70, 93, 0.1);
}
.addon-policy-currency {
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
}
.addon-policy-fixed-input {
  width: 92px;
  padding: 0;
  border: none;
  background: transparent;
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
  outline: none;
  appearance: textfield;
  -moz-appearance: textfield;
}
.addon-policy-fixed-input::-webkit-inner-spin-button,
.addon-policy-fixed-input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.addon-policy-fixed-suffix {
  font-size: 12px;
  font-weight: 500;
  color: #94a3b8;
  white-space: nowrap;
}
.addon-card--policy .addon-buy-btn {
  min-height: 44px;
  padding: 0 16px;
  border-radius: 12px;
  border: 1px solid #dbe3ec;
  background: #ffffff;
  color: #0f172a;
  box-shadow: none;
}
.addon-card--policy .addon-buy-btn:hover:not([disabled]) {
  transform: none;
  background: #f8fafc;
  box-shadow: none;
  filter: none;
}
.addon-card--policy .addon-buy-btn:active:not([disabled]) {
  transform: none;
  background: #f1f5f9;
  box-shadow: none;
}
.addon-policy-suggestions {
  display: grid;
  gap: 10px;
}
.addon-policy-suggestions-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.addon-policy-suggestions-label {
  font-size: 12px;
  font-weight: 600;
  color: #0f172a;
}
.addon-policy-suggestions-note {
  font-size: 12px;
  color: #94a3b8;
}
.addon-policy-suggestions-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.addon-policy-preset {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #ffffff;
  font-size: 13px;
  font-weight: 600;
  color: #334155;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.addon-policy-preset:hover:not(:disabled):not(.is-active) {
  background: #f8fafc;
  border-color: #cbd5e1;
}
.addon-policy-preset.is-active {
  background: #f4f8fc;
  border-color: #cadff0;
  color: #3730a3;
}
.addon-policy-preset:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.addon-policy-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.addon-policy-footer-copy {
  margin: 0;
  color: #94a3b8;
}
.addon-policy-clear {
  font-size: 13px;
  font-weight: 600;
  color: #36465d;
  cursor: pointer;
  white-space: nowrap;
}
.addon-policy-clear:hover {
  color: #36465d;
  text-decoration: underline;
}
.addon-policy-ledger {
  display: grid;
  gap: 12px;
  padding-top: 18px;
  border-top: 1px solid #eef2f7;
}
.addon-policy-ledger-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.addon-policy-ledger-note {
  font-size: 12px;
  color: #94a3b8;
}
.addon-policy-ledger-list {
  display: grid;
}
.addon-policy-ledger-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0;
  border-top: 1px solid #f1f5f9;
}
.addon-policy-ledger-row:first-child {
  padding-top: 0;
  border-top: none;
}
.addon-policy-ledger-primary {
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
}
.addon-policy-ledger-primary strong {
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
}
.addon-policy-ledger-primary span {
  font-size: 13px;
  color: #94a3b8;
}
.addon-policy-ledger-secondary {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.addon-policy-ledger-amount {
  font-size: 13px;
  font-weight: 600;
  color: #334155;
}
@media (max-width: 900px) {
  .addon-policy-shell {
    padding: 20px;
  }
  .addon-policy-summary,
  .addon-policy-controls,
  .addon-policy-footer,
  .addon-policy-ledger-head {
    flex-direction: column;
    align-items: flex-start;
  }
  .addon-policy-summary-metric {
    justify-items: start;
    text-align: left;
  }
  .addon-policy-control-actions {
    width: 100%;
    justify-content: flex-start;
  }
  .addon-policy-ledger-row {
    flex-direction: column;
    align-items: flex-start;
  }
  .addon-policy-ledger-secondary {
    flex-wrap: wrap;
  }
}
/* -- credit estimator slider -- */
.addon-estimator {
  border-top: 1px solid #f1f5f9;
  padding: 12px 16px 10px;
}
.addon-estimator-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
.addon-estimator-end {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 38px;
  flex-shrink: 0;
  gap: 1px;
}
.addon-estimator-end strong {
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
}
.addon-estimator-end span {
  font-size: 9px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.addon-estimator-plus strong {
  color: #38bdf8;
}
.addon-estimator-plus span {
  color: #38bdf8;
}
.addon-estimator-phd strong {
  color: #7aadda;
}
.addon-estimator-phd span {
  color: #7aadda;
}
/* slider resets */
.addon-estimator-slider {
  -webkit-appearance: none;
  appearance: none;
  flex: 1;
  height: 24px;
  background: transparent;
  cursor: pointer;
  margin: 0;
  outline: none;
  border: none;
}
.addon-estimator-slider:focus {
  outline: none;
}
.addon-estimator-slider::-webkit-slider-runnable-track {
  height: 6px;
  border-radius: 999px;
  border: none;
  background: linear-gradient(90deg, #bae6fd 0%, #cadff0 50%, #a5b4fc 100%);
}
.addon-estimator-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  margin-top: -5px;
  border: none;
  background: linear-gradient(135deg, #428bca, #7aadda);
  box-shadow: 0 1px 4px rgba(66, 139, 202, 0.35);
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}
.addon-estimator-slider:hover::-webkit-slider-thumb,
.addon-estimator-slider:active::-webkit-slider-thumb {
  transform: scale(1.15);
  box-shadow: 0 2px 8px rgba(66, 139, 202, 0.4);
}
.addon-estimator-slider::-moz-range-track {
  height: 6px;
  border-radius: 999px;
  border: none;
  background: linear-gradient(90deg, #bae6fd 0%, #cadff0 50%, #a5b4fc 100%);
}
.addon-estimator-slider::-moz-range-thumb {
  width: 16px;
  height: 16px;
  border: none;
  border-radius: 50%;
  background: linear-gradient(135deg, #428bca, #7aadda);
  box-shadow: 0 1px 4px rgba(66, 139, 202, 0.35);
}
.addon-estimator-slider::-moz-focus-outer {
  border: 0;
}
.addon-estimator-hint {
  margin: 6px 0 0;
  font-size: 10px;
  color: #94a3b8;
  text-align: center;
}
.addon-estimator-disclaimer {
  margin: 2px 0 0;
  font-size: 9px;
  color: #cbd5e1;
  text-align: center;
  font-style: italic;
}
/* -- purchase history (compact inline rows) -- */
.addon-history {
  border-top: 1px solid #f1f5f9;
  padding: 12px 16px 14px;
}
.addon-history-title {
  margin: 0 0 8px 0;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
}
.addon-history-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  font-size: 12px;
}
.addon-history-credits {
  font-weight: 600;
  color: #334155;
  min-width: 72px;
}
.addon-history-date {
  color: #94a3b8;
  flex: 1;
}
.addon-history-amount {
  font-weight: 650;
  color: #0f172a;
  min-width: 52px;
  text-align: right;
}
.addon-history-expiry {
  font-size: 11px;
  color: #64748b;
  font-style: italic;
}
.addon-policy-ledger {
  margin: 0;
  padding: 18px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #ffffff;
}
.addon-history--ledger {
  padding: 10px 0 0;
  border-top: none;
}
.addon-history--ledger .addon-history-item {
  padding: 12px 0;
  border-top: 1px solid #e2e8f0;
}
.addon-history--ledger .addon-history-item:first-child {
  padding-top: 0;
  border-top: none;
}
.addon-history--ledger .addon-history-date {
  flex: 0 0 72px;
}
.addon-history--ledger .addon-history-amount {
  min-width: 66px;
}
.addon-history--ledger .billing-mini-status,
.addon-history--ledger .addon-history-expiry {
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .addon-policy-shell {
    padding: 18px;
  }
  .addon-usage-breakout-head,
  .addon-policy-title-row,
  .addon-policy-section-head,
  .addon-policy-save-strip,
  .addon-checkout-strip--policy,
  .addon-policy-footer {
    flex-direction: column;
    align-items: flex-start;
  }
  .addon-usage-breakout-side {
    max-width: none;
    text-align: left;
  }
  .addon-tiers--mode,
  .addon-tiers--suggestions {
    grid-template-columns: 1fr;
  }
  .addon-checkout-right,
  .addon-checkout-right--policy {
    width: 100%;
    justify-content: space-between;
    margin-left: 0;
  }
  .addon-history--ledger .addon-history-item {
    flex-wrap: wrap;
    row-gap: 8px;
  }
  .addon-history--ledger .addon-history-date {
    flex: initial;
  }
}
/* Legacy addon primer/discount styles removed – now handled by redesigned addon card */
.billing-controls-grid-single {
  grid-template-columns: 1fr;
}
/* Legacy billing estimate/purchase-list styles removed – handled by addon card redesign */
/* Danger panel card – same card as others, red accent */
.account-panel-card--danger {
  border-left: 4px solid #dc2626;
}
.account-panel-card--danger .danger-title {
  color: #dc2626 !important;
}
.deactivation-info-title,
.confirmation-box-title {
  font-size: 15px;
  font-weight: 600;
  color: #991b1b;
  margin: 0 0 12px 0;
}
/* Modern form styling */
.form-field {
  margin-bottom: 18px;
}
.field-label {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 8px;
  letter-spacing: -0.1px;
}
.input-wrapper {
  position: relative;
  border-radius: 8px;
  border: 2px solid #e2e8f0;
  background: #f8fafc;
  transition: all 0.2s ease;
}
.input-wrapper.input-focus {
  border-color: #428bca;
  background: #ffffff;
  box-shadow: 0 0 0 4px rgba(66, 139, 202, 0.1);
}
.input-wrapper.input-error {
  border-color: #ef4444;
  background: #fef2f2;
}
.input-wrapper.input-error.input-focus {
  box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.1);
}
.input-wrapper.input-disabled {
  background: #f1f5f9;
  border-color: #e2e8f0;
}
.modern-input {
  width: 100%;
  padding: 12px 16px;
  font-size: 15px;
  font-weight: 500;
  color: #2c3e50;
  background: transparent;
  border: none;
  outline: none;
  box-sizing: border-box;
  border-radius: 8px;
}
.modern-input::placeholder {
  color: #94a3b8;
  font-weight: 400;
}
.modern-input:disabled {
  color: #64748b;
  cursor: not-allowed;
}
.field-error {
  font-size: 12px;
  color: #dc2626;
  margin-top: 6px;
  font-weight: 500;
}
.field-hint {
  font-size: 12px;
  color: #64748b;
  margin-top: 6px;
  font-weight: 400;
}
/* Modern submit button */
.modern-submit.md-button {
  width: 100% !important;
  height: 50px !important;
  margin: 8px 0 0 0 !important;
  border-radius: 8px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  transition: all 0.2s ease !important;
}
.modern-submit.md-primary.md-button {
  background: #3f7ece !important;
  color: #ffffff !important;
}
.modern-submit.md-primary.md-button:hover,
.modern-submit.md-primary.md-button:focus {
  background: #356db3 !important;
}
.modern-submit.danger-button.md-button {
  background: #dc2626 !important;
  color: #ffffff !important;
}
.modern-submit.danger-button.md-button:hover,
.modern-submit.danger-button.md-button:focus {
  background: #b91c1c !important;
}
.modern-submit.cancel-button.md-button {
  background: #f1f5f9 !important;
  color: #64748b !important;
}
.modern-submit.cancel-button.md-button:hover,
.modern-submit.cancel-button.md-button:focus {
  background: #e2e8f0 !important;
  color: #475569 !important;
}
/* Alert styling */
.alert {
  padding: 12px 16px;
  border-radius: 8px;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
}
.alert md-icon {
  font-size: 20px !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
}
.alert-success {
  background: #dcfce7;
  color: #166534;
  border: 1px solid #86efac;
}
.alert-success md-icon {
  color: #22c55e !important;
}
.alert-danger {
  background: #fef2f2;
  color: #991b1b;
  border: 1px solid #fecaca;
}
.alert-danger md-icon {
  color: #dc2626 !important;
}
.alert-warning {
  background: #fff6e8;
  color: #8f4b14;
  border: 1px solid #f5d4a8;
}
.alert-warning md-icon {
  color: #b26a21 !important;
}
/* SSO Connection styling */
.sso-connection {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: #f8fafc;
  border-radius: 8px;
  margin-bottom: 8px;
}
.sso-connection-icon {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: #e2e8f0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.sso-connection-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sso-connection-icon md-icon {
  font-size: 24px !important;
  color: #64748b !important;
}
.sso-connection-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.sso-connection-info strong {
  font-size: 14px;
  color: #1e293b;
}
.sso-connection-date {
  font-size: 12px;
  color: #64748b;
}
.sso-connection-status .badge-success {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 8px;
  background: #dcfce7;
  color: #166534;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}
.sso-connection-status .badge-success md-icon {
  font-size: 14px !important;
  width: 14px !important;
  height: 14px !important;
  min-width: 14px !important;
  min-height: 14px !important;
  color: #22c55e !important;
}
/* Deactivation info */
.deactivation-info h4,
.deactivation-info .deactivation-info-title {
  font-size: 15px;
  font-weight: 600;
  color: #991b1b;
  margin: 0 0 12px 0;
}
.deactivation-info p {
  font-size: 14px;
  color: #7f1d1d;
  margin: 0 0 8px 0;
}
.deactivation-info ul {
  margin: 0 0 12px 0;
  padding-left: 20px;
}
.deactivation-info li {
  font-size: 14px;
  color: #7f1d1d;
  margin-bottom: 4px;
}
/* Confirmation box */
.confirmation-box h4,
.confirmation-box .confirmation-box-title {
  font-size: 15px;
  font-weight: 600;
  color: #991b1b;
  margin: 0 0 12px 0;
}
.confirmation-box p {
  font-size: 14px;
  color: #7f1d1d;
  margin: 0 0 12px 0;
}
/* Form actions */
.form-actions {
  margin-top: 20px;
}
/* Success Animation Overlay */
.success-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.97);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  border-radius: 12px;
  opacity: 0;
  visibility: hidden;
  transform: scale(0.9);
  transition: opacity 0.15s ease-out, visibility 0.15s ease-out, transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.success-overlay.show {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}
.success-overlay.fade-out {
  opacity: 0;
  visibility: hidden;
  transform: scale(0.95);
  transition: opacity 0.25s ease-out, visibility 0.25s ease-out, transform 0.25s ease-out;
}
.success-animation-container {
  text-align: center;
  animation: popIn 0.25s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}
@keyframes popIn {
  0% {
    transform: scale(0.8);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
.success-checkmark {
  width: 72px;
  height: 72px;
  margin: 0 auto 12px;
}
.checkmark-svg {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  display: block;
  stroke-width: 2;
  stroke: #22c55e;
  stroke-miterlimit: 10;
  box-shadow: inset 0px 0px 0px #22c55e;
  animation: fillGreen 0.15s ease-out 0.1s forwards, elasticPop 0.35s cubic-bezier(0.34, 1.56, 0.64, 1) 0.25s both;
}
.checkmark-circle {
  stroke-dasharray: 166;
  stroke-dashoffset: 166;
  stroke-width: 2;
  stroke-miterlimit: 10;
  stroke: #22c55e;
  fill: none;
  animation: strokeCircle 0.25s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}
.checkmark-check {
  transform-origin: 50% 50%;
  stroke-dasharray: 48;
  stroke-dashoffset: 48;
  stroke-width: 3;
  stroke: #22c55e;
  animation: strokeCheck 0.15s cubic-bezier(0.65, 0, 0.45, 1) 0.2s forwards;
}
@keyframes strokeCircle {
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes strokeCheck {
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes fillGreen {
  100% {
    box-shadow: inset 0px 0px 0px 36px rgba(34, 197, 94, 0.15);
  }
}
@keyframes elasticPop {
  0% {
    transform: scale(1);
  }
  40% {
    transform: scale(1.15);
  }
  70% {
    transform: scale(0.95);
  }
  100% {
    transform: scale(1);
  }
}
.success-text {
  font-size: 18px;
  font-weight: 600;
  color: #166534;
  margin: 0;
  animation: slideUp 0.2s cubic-bezier(0.34, 1.56, 0.64, 1) 0.15s both;
}
@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* Make the password section position relative for overlay */
.account-section {
  position: relative;
}
@media (max-width: 900px) {
  .account-shell-wrap {
    max-width: 760px;
    padding: 72px 14px 24px;
  }
  .account-card {
    max-width: 100% !important;
  }
  .account-settings-shell.account-card {
    height: auto;
    max-height: none;
    min-height: 0;
  }
  .account-settings-layout {
    display: flex;
    flex-direction: column;
    height: auto;
  }
  .account-settings-sidebar {
    padding: 22px 20px 18px;
    border-right: none;
    border-bottom: 1px solid #e2e8f0;
    gap: 16px;
  }
  .account-sidebar-brand {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 12px;
    align-items: center;
  }
  .account-sidebar-brand .account-icon {
    grid-row: span 2;
    margin: 0;
  }
  .account-sidebar-brand .account-title {
    font-size: 22px !important;
  }
  .account-sidebar-brand .account-subtitle {
    max-width: none;
  }
  .account-settings-sidebar .account-tabs {
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 6px;
    padding: 4px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
  }
  .account-settings-sidebar .account-tab {
    flex: 1 1 0;
    justify-content: center;
    min-width: 0;
    padding: 10px 8px;
    text-align: center;
  }
  .account-settings-sidebar .account-tab span {
    white-space: nowrap;
  }
  .account-settings-main-head {
    padding: 24px 22px 14px;
  }
  .account-settings-main-title {
    font-size: 30px;
  }
  .account-settings-content {
    overflow: visible;
    padding: 0 22px 30px;
  }
  .account-settings-content .account-section {
    max-width: none;
  }
  .account-header {
    padding: 24px 20px 16px !important;
  }
  #account-form-container .account-title {
    font-size: 24px !important;
  }
  .account-tab {
    flex: 1 1 calc(50% - 8px);
    text-align: center;
  }
  .u-breakdown-kpis {
    flex-wrap: wrap;
  }
  .u-breakdown-kpi {
    flex: 1 1 calc(50% - 1px);
  }
  /* billing */
  .b-sub-top {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .b-credits-hero {
    flex-direction: column;
    gap: 10px;
  }
  .b-credits-hero-right {
    align-items: flex-start;
    justify-items: start;
    text-align: left;
  }
  .b-usage-rail-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
  .b-sub-stats {
    flex-wrap: wrap;
  }
  .b-sub-stat {
    flex: 1 1 calc(50% - 1px);
  }
  .b-sub-footer {
    flex-wrap: wrap;
  }
  .b-sub-timeline {
    flex-wrap: wrap;
    gap: 6px;
  }
  .b-sub-tl-line {
    min-width: 16px;
  }
  /* credits */
  .addon-tiers {
    flex-wrap: wrap;
  }
  .addon-tier {
    flex: 1 1 calc(50% - 1px);
  }
  .addon-top {
    gap: 8px;
  }
  .addon-checkout-strip {
    flex-wrap: wrap;
  }
  .addon-policy-shell {
    padding: 18px;
    gap: 16px;
  }
  .addon-policy-title-row {
    flex-direction: column;
    align-items: flex-start;
  }
  .addon-policy-badges {
    width: 100%;
  }
  .addon-usage-breakout-head {
    flex-direction: column;
    align-items: flex-start;
  }
  .addon-usage-breakout-side {
    max-width: none;
    text-align: left;
  }
  .addon-tiers--mode {
    grid-template-columns: 1fr;
  }
  .addon-tiers--suggestions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .addon-checkout-strip--policy,
  .addon-policy-save-strip,
  .addon-policy-footer,
  .addon-policy-section-head {
    flex-direction: column;
    align-items: stretch;
  }
  .addon-checkout-right--policy {
    width: 100%;
    margin-left: 0;
    justify-content: space-between;
  }
  .addon-total--policy {
    align-items: flex-start;
  }
  .addon-policy-clear {
    align-self: flex-start;
  }
  .security-activity-grid {
    grid-template-columns: 1fr;
  }
  .security-revoke-box {
    align-items: stretch;
    flex-direction: column;
  }
  .account-secondary-danger-btn {
    width: 100%;
  }
  .billing-table-wrap {
    overflow-x: auto;
  }
}
@media (max-width: 480px) {
  .account-settings-sidebar .account-tabs {
    gap: 4px;
    padding: 3px;
  }
  .account-settings-sidebar .account-tab {
    gap: 5px;
    padding: 9px 4px;
    font-size: 12px;
  }
  .account-settings-sidebar .account-tab md-icon {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    font-size: 18px !important;
    line-height: 18px !important;
  }
}
.account-header {
  margin-top: 40px;
  margin-bottom: 50px;
  padding-bottom: 40px;
  border-bottom: 1px solid #e8e8e8;
  text-align: center;
}
.account-header .account-header-icon {
  width: 80px;
  height: 80px;
  margin: 0 auto 24px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 24px rgba(102, 126, 234, 0.35);
}
.account-header .account-header-icon .fa,
.account-header .account-header-icon md-icon {
  font-size: 36px !important;
  width: 36px !important;
  height: 36px !important;
  color: white;
}
.account-header .account-title {
  font-weight: 300;
  font-size: 42px;
  color: #333;
  margin: 0 0 16px;
  letter-spacing: -0.5px;
}
.account-header .account-subtitle {
  font-size: 16px;
  color: #777;
}
.account-header .account-subtitle a {
  color: #667eea;
  text-decoration: none;
  transition: color 0.2s ease;
}
.account-header .account-subtitle a:hover {
  color: #764ba2;
}
.account-management {
  margin: 0 auto;
  max-width: 657px;
}
.account-management .page-title {
  color: #212121;
  margin-bottom: 30px;
  font-weight: 300;
  text-align: center;
}
.account-management .account-section {
  background: #fff;
  border-radius: 8px;
  margin-bottom: 30px;
  padding: 30px;
  margin: 30px;
}
.account-management .account-section.danger-zone {
  border: 2px solid #a54243;
  background: #fff5f5;
}
.account-management .account-section.danger-zone h3 {
  color: #a54243;
  border-bottom-color: #a54243;
}
.account-management .account-section.danger-zone .deactivation-info {
  margin-bottom: 20px;
}
.account-management .account-section.danger-zone .deactivation-info h4 {
  color: #a54243;
  margin-bottom: 15px;
}
.account-management .account-section.danger-zone .deactivation-info ul {
  margin: 10px 0;
  padding-left: 20px;
}
.account-management .account-section.danger-zone .deactivation-info ul li {
  margin-bottom: 5px;
  color: #555;
}
.account-management .account-section.danger-zone .deactivation-info .text-muted {
  font-size: 14px;
  margin-top: 15px;
}
.account-management .account-section.danger-zone .confirmation-box {
  background: #fff;
  border: 1px solid #a54243;
  border-radius: 8px;
  padding: 20px;
  margin-top: 15px;
}
.account-management .account-section.danger-zone .confirmation-box h4 {
  color: #a54243;
  margin-bottom: 15px;
}
.account-management .account-section.danger-zone .confirmation-box p {
  margin-bottom: 15px;
}
.account-management .account-section.danger-zone .confirmation-box p:last-of-type {
  margin-bottom: 20px;
  font-weight: 500;
}
.account-management .account-section.danger-zone .confirmation-box .form-actions {
  margin-top: 20px;
  border-top: none;
  padding-top: 0;
  display: flex;
  justify-content: flex-end;
}
.account-management .account-section.danger-zone .confirmation-box .form-actions .btn {
  margin-right: 10px;
}
.account-management .account-section.danger-zone .confirmation-box .form-actions .btn:last-child {
  margin-right: 0;
}
.account-management .account-section.danger-zone .btn-danger {
  background-color: #a54243;
  border-color: #a54243;
  color: #FFFFFF;
}
.account-management .account-section.danger-zone .btn-danger:hover:not(:disabled) {
  background-color: #933b3c;
  border-color: #933b3c;
}
.account-management .account-section.danger-zone .btn-danger:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.account-management .account-section h3 {
  color: #555;
  margin-bottom: 20px;
  font-weight: 400;
  padding-bottom: 10px;
  border-bottom: 2px solid #f0f0f0;
}
.account-management .account-section .sso-connection {
  display: flex;
  align-items: center;
  padding: 15px;
  background: #f8f9fa;
  border-radius: 8px;
  margin-bottom: 10px;
}
.account-management .account-section .sso-connection:last-child {
  margin-bottom: 0;
}
.account-management .account-section .sso-connection .sso-connection-icon {
  width: 48px;
  height: 48px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 15px;
}
.account-management .account-section .sso-connection .sso-connection-icon .fa {
  color: white;
  font-size: 20px;
}
.account-management .account-section .sso-connection .sso-connection-info {
  flex: 1;
}
.account-management .account-section .sso-connection .sso-connection-info strong {
  display: block;
  font-size: 16px;
  color: #333;
  text-transform: capitalize;
}
.account-management .account-section .sso-connection .sso-connection-info .sso-connection-date {
  font-size: 13px;
  color: #777;
}
.account-management .account-section .sso-connection .sso-connection-status .badge {
  padding: 6px 12px;
  font-size: 12px;
  border-radius: 20px;
}
.account-management .account-section .sso-connection .sso-connection-status .badge.badge-success {
  background: #d4edda;
  color: #155724;
}
.account-management .account-section .sso-connection .sso-connection-status .badge.badge-success .fa {
  margin-right: 4px;
}
.account-management .account-section .form-group {
  margin-bottom: 20px;
}
.account-management .account-section .form-group label {
  font-weight: 500;
  color: #555;
  margin-bottom: 8px;
  display: block;
}
.account-management .account-section .form-group .form-control {
  border: 2px solid #e1e5e9;
  border-radius: 8px;
  padding: 12px 15px;
  font-size: 14px;
  transition: border-color 0.3s ease;
  width: calc(100% - 31px);
}
.account-management .account-section .form-group .form-control:focus {
  border-color: #007bff;
  outline: none;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
.account-management .account-section .form-group .form-control.ng-invalid.ng-touched {
  border-color: #dc3545;
}
.account-management .account-section .form-group .form-control.ng-valid.ng-touched {
  border-color: #28a745;
}
.account-management .account-section .form-error {
  margin-top: 5px;
}
.account-management .account-section .form-error .error {
  color: #dc3545;
  font-size: 13px;
  display: block;
  margin-top: 3px;
}
.account-management .account-section .form-actions {
  margin-top: 25px;
  padding-top: 20px;
  border-top: 1px solid #f0f0f0;
  display: flex;
  justify-content: flex-end;
}
.account-management .account-section .form-actions .btn {
  padding: 0px 12px;
  font-weight: 500;
}
.account-management .account-section .form-actions .btn.btn-primary {
  background-color: #428bca;
  border-color: #428bca;
  color: #FFFFFF;
}
.account-management .account-section .form-actions .btn.btn-primary:hover:not(:disabled) {
  background-color: #36465d;
  border-color: #36465d;
}
.account-management .account-section .form-actions .btn.btn-primary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.account-management .account-section .form-actions .btn .fa-spinner {
  margin-right: 8px;
}
.account-management .alert {
  border-radius: 8px;
  padding: 12px 16px;
  margin-bottom: 20px;
  border: none;
}
.account-management .alert.alert-success {
  background-color: #d4edda;
  color: #155724;
  border-left: 4px solid #28a745;
}
.account-management .alert.alert-success .fa {
  color: #28a745;
  margin-right: 8px;
}
.account-management .alert.alert-danger {
  background-color: #f8d7da;
  color: #721c24;
  border-left: 4px solid #dc3545;
}
.account-management .alert.alert-danger .fa {
  color: #dc3545;
  margin-right: 8px;
}
#login-form .form-control.ng-invalid-email,
#login-form .form-control.ng-valid-parse.ng-invalid-minlength {
  color: #a54243;
  border-color: #a54243;
}
#login-form .form-control.ng-invalid-email:focus,
#login-form .form-control.ng-valid-parse.ng-invalid-minlength:focus {
  border-color: #a54243;
  box-shadow: none;
  outline: 0 none;
}
#login-form .form-error {
  margin: 0 auto 20px;
  position: relative;
}
#login-form .form-error .error {
  left: 0;
  position: absolute;
  font-size: 12px;
  color: #a54243;
}
#login-form .reset-link {
  position: absolute;
  bottom: 2px;
  right: 0px;
}
#login-form .tooltip {
  background: none;
}
.login__submit {
  transition: all 0.2s;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
}
.login__submit.md-button {
  min-width: 36px;
}
.login__submit.processing-add * {
  opacity: 0;
}
.login__submit.processing-add md-progress-circular path {
  stroke: #FFFFFF;
}
.login__submit.processing {
  opacity: 1;
  width: 36px;
  background-color: #36465d;
  color: #FFFFFF;
  border-radius: 50%;
  transform: rotate(360deg);
  padding: 0px;
}
.login__submit.processing * {
  opacity: 1;
}
.login__submit.processing md-progress-circular {
  left: 5.5px;
  top: 5.5px;
  position: absolute;
}
.login__submit.processing md-progress-circular path {
  stroke: #FFFFFF;
}
.login__submit.success {
  background-color: #36465d !important;
  color: #FFFFFF;
}
.login__submit.success.md-icon-button.md-button {
  height: 36px;
  width: 36px;
  border-radius: 50%;
  padding: 0px;
}
.action-result {
  border-radius: 8px;
  color: #333;
  font-weight: 300;
  padding: 10px;
}
.action-result h1,
.action-result h2,
.action-result h3,
.action-result h4,
.action-result h5,
.action-result h6 {
  margin-bottom: 0px;
  margin-top: 0px;
}
.settings-submit {
  transition: all 0.2s;
  height: 40px;
}
.settings-submit.success.md-icon-button.md-button {
  padding: 0px;
}
#cyberHexGrid {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  z-index: 0;
  /* beneath form */
  pointer-events: none;
  /* allow input */
  mix-blend-mode: screen;
  /* optional glow over gradient */
}
.modern-input-group {
  margin-bottom: 24px;
  position: relative;
}
.modern-input-group input {
  width: calc(100% - 46px);
  border-radius: 12px;
  border: 2px solid rgba(33, 33, 33, 0.12);
  padding: 16px 20px;
  font-size: 16px;
  background: rgba(255, 255, 255, 0.9);
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  font-family: inherit;
  color: #212121;
}
.modern-input-group input::placeholder {
  color: rgba(33, 33, 33, 0.5);
  font-weight: 400;
  transition: color 0.3s ease;
}
.modern-input-group input:focus {
  border-color: #428bca;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 4px 16px rgba(66, 139, 202, 0.15);
  outline: none;
}
.modern-input-group input:focus::placeholder {
  color: rgba(66, 139, 202, 0.6);
}
.modern-input-group input.ng-invalid.ng-touched {
  border-color: #a54243;
  background: rgba(165, 66, 67, 0.02);
}
.modern-input-group input.ng-invalid.ng-touched::placeholder {
  color: rgba(165, 66, 67, 0.6);
}
.modern-input-group input.ng-valid.ng-touched {
  border-color: #4caf50;
  background: rgba(76, 175, 80, 0.02);
}
.modern-input-group input.ng-valid.ng-touched::placeholder {
  color: rgba(76, 175, 80, 0.6);
}
.hero.login-form.modern-signup,
#login-form-container {
  position: relative;
  z-index: 1;
  /* above background grid */
}
.modern-signup {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  min-height: 100vh;
  position: relative;
  overflow: hidden;
}
.modern-signup .signup-background-decoration {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}
.modern-signup .signup-background-decoration .spline-canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.8;
  z-index: 1;
}
.modern-signup .signup-card {
  background: rgba(255, 255, 255, 0.98);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 20px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(255, 255, 255, 0.8);
  border: none;
  overflow: hidden;
  position: relative;
  z-index: 1;
  animation: slideInUp 0.6s ease-out;
  margin: 0 auto;
}
.modern-signup .signup-header {
  text-align: center;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.2) 100%);
}
.modern-signup .signup-header .signup-icon {
  margin-bottom: 16px;
}
.modern-signup .signup-header .signup-icon md-icon {
  font-size: 48px;
  height: 48px;
  width: 48px;
  color: #428bca;
  background: linear-gradient(135deg, rgba(66, 139, 202, 0.08) 0%, rgba(66, 139, 202, 0.15) 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  box-shadow: 0 6px 20px rgba(66, 139, 202, 0.2);
}
.modern-signup .signup-header .signup-title {
  font-size: 32px;
  font-weight: 600;
  color: #212121;
  margin: 0 0 8px 0;
}
.modern-signup .signup-header .signup-subtitle {
  font-size: 16px;
  color: rgba(33, 33, 33, 0.7);
  margin: 0;
  font-weight: 400;
}
.modern-signup .signup-content {
  padding: 16px 32px 32px;
}
.modern-signup .modern-input-group {
  margin-bottom: 24px;
  position: relative;
}
.modern-signup .modern-input-group input {
  width: calc(100% - 46px);
  border-radius: 12px;
  border: 2px solid rgba(33, 33, 33, 0.12);
  padding: 16px 20px;
  font-size: 16px;
  background: rgba(255, 255, 255, 0.9);
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  font-family: inherit;
  color: #212121;
}
.modern-signup .modern-input-group input::placeholder {
  color: rgba(33, 33, 33, 0.5);
  font-weight: 400;
  transition: color 0.3s ease;
}
.modern-signup .modern-input-group input:focus {
  border-color: #428bca;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 4px 16px rgba(66, 139, 202, 0.15);
  outline: none;
}
.modern-signup .modern-input-group input:focus::placeholder {
  color: rgba(66, 139, 202, 0.6);
}
.modern-signup .modern-input-group input.ng-invalid.ng-touched {
  border-color: #a54243;
  background: rgba(165, 66, 67, 0.02);
}
.modern-signup .modern-input-group input.ng-invalid.ng-touched::placeholder {
  color: rgba(165, 66, 67, 0.6);
}
.modern-signup .modern-input-group input.ng-valid.ng-touched {
  border-color: #4caf50;
  background: rgba(76, 175, 80, 0.02);
}
.modern-signup .modern-input-group input.ng-valid.ng-touched::placeholder {
  color: rgba(76, 175, 80, 0.6);
}
.modern-signup .reactivation-section .modern-input-group {
  margin-bottom: 24px;
  position: relative;
}
.modern-signup .reactivation-section .modern-input-group input {
  width: 100%;
  border-radius: 12px;
  border: 2px solid rgba(33, 33, 33, 0.12);
  padding: 16px 20px;
  font-size: 16px;
  background: rgba(255, 255, 255, 0.9);
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  font-family: inherit;
  color: #212121;
}
.modern-signup .reactivation-section .modern-input-group input::placeholder {
  color: rgba(33, 33, 33, 0.5);
  font-weight: 400;
}
.modern-signup .reactivation-section .modern-input-group input:focus {
  border-color: #428bca;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 4px 16px rgba(66, 139, 202, 0.15);
  outline: none;
}
.modern-signup .reactivation-section .modern-input-group input.ng-invalid.ng-touched {
  border-color: #a54243;
  background: rgba(165, 66, 67, 0.02);
}
.modern-signup .reactivation-section .modern-input-group input.ng-valid.ng-touched {
  border-color: #4caf50;
  background: rgba(76, 175, 80, 0.02);
}
.modern-signup .modern-error {
  color: #a54243;
  font-size: 13px;
  margin-top: 8px;
  display: flex;
  align-items: center;
  font-weight: 500;
}
.modern-signup .modern-error::before {
  content: '⚠';
  margin-right: 6px;
  font-size: 12px;
}
.modern-signup .modern-hint {
  color: rgba(33, 33, 33, 0.6);
  font-size: 13px;
  margin-top: 8px;
  font-style: italic;
}
.modern-signup .modern-hint::before {
  content: '💡';
  margin-right: 6px;
  font-size: 12px;
}
.modern-signup .modern-error-message {
  color: #a54243;
  font-size: 12px;
  margin-top: 5px;
  font-weight: 500;
  padding: 8px 12px;
  background: rgba(165, 66, 67, 0.1);
  border-radius: 8px;
  border-left: 3px solid #a54243;
}
.modern-signup .modern-actions {
  margin-top: 32px;
  gap: 16px;
}
.modern-signup .modern-actions.reactivation-actions {
  justify-content: space-between;
  flex-direction: row;
}
.modern-signup .modern-primary-button {
  background: linear-gradient(135deg, #428bca 0%, #5a9fd4 100%);
  color: #FFFFFF;
  border: none;
  border-radius: 12px;
  padding: 16px 32px;
  font-size: 16px;
  font-weight: 600;
  text-transform: none;
  min-width: 200px;
  box-shadow: 0 6px 20px rgba(66, 139, 202, 0.4);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}
.modern-signup .modern-primary-button::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.5s ease;
}
.modern-signup .modern-primary-button:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(66, 139, 202, 0.5);
}
.modern-signup .modern-primary-button:hover:not(:disabled)::before {
  left: 100%;
}
.modern-signup .modern-primary-button:active {
  transform: translateY(0);
}
.modern-signup .modern-primary-button:disabled {
  opacity: 0.7;
  cursor: not-allowed;
  transform: none;
  box-shadow: 0 6px 20px rgba(66, 139, 202, 0.2);
}
.modern-signup .modern-primary-button.processing {
  background: linear-gradient(135deg, rgba(66, 139, 202, 0.8) 0%, rgba(90, 159, 212, 0.8) 100%);
}
.modern-signup .signup-submit-button {
  transition: all 0.2s;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
}
.modern-signup .signup-submit-button.md-button {
  min-width: 36px;
}
.modern-signup .signup-submit-button.processing-add * {
  opacity: 0;
}
.modern-signup .signup-submit-button.processing-add md-progress-circular path {
  stroke: #FFFFFF;
}
.modern-signup .signup-submit-button.processing {
  opacity: 1;
  width: 36px;
  background-color: #428bca;
  color: #FFFFFF;
  border-radius: 50%;
  transform: rotate(360deg);
  padding: 0px;
  min-width: 36px;
}
.modern-signup .signup-submit-button.processing * {
  opacity: 1;
}
.modern-signup .signup-submit-button.processing md-progress-circular {
  left: 5.5px;
  top: 6px;
  position: absolute;
}
.modern-signup .signup-submit-button.processing md-progress-circular path {
  stroke: #FFFFFF;
}
.modern-signup .signup-submit-button.success {
  background-color: #4caf50;
  border-radius: 50%;
}
.modern-signup .signup-submit-button.success.md-icon-button.md-button {
  width: 36px;
  height: 36px;
}
.modern-signup .modern-secondary-button {
  background: transparent;
  color: #212121;
  border: 2px solid rgba(33, 33, 33, 0.2);
  border-radius: 12px;
  padding: 14px 28px;
  font-size: 16px;
  font-weight: 500;
  text-transform: none;
  transition: all 0.3s ease;
}
.modern-signup .modern-secondary-button:hover:not(:disabled) {
  background: rgba(33, 33, 33, 0.05);
  border-color: rgba(33, 33, 33, 0.4);
  transform: translateY(-1px);
}
.modern-signup .modern-secondary-button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.modern-signup .login-link-container {
  margin-top: 24px;
  text-align: center;
}
.modern-signup .login-link-container .login-text {
  color: rgba(33, 33, 33, 0.7);
  font-size: 14px;
  margin-right: 8px;
}
.modern-signup .login-link-container .login-link {
  color: #428bca;
  text-decoration: none;
  font-weight: 600;
  font-size: 14px;
  position: relative;
  transition: color 0.3s ease;
}
.modern-signup .login-link-container .login-link::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 2px;
  background: #428bca;
  transition: width 0.3s ease;
}
.modern-signup .login-link-container .login-link:hover {
  color: #5a9fd4;
}
.modern-signup .login-link-container .login-link:hover::after {
  width: 100%;
}
.modern-signup .modern-alert {
  border-radius: 12px;
  border: none;
  font-weight: 500;
}
.modern-signup .modern-alert p {
  display: flex;
  align-items: center;
}
.modern-signup .modern-alert p::before {
  content: 'ℹ️';
  margin-right: 8px;
  font-size: 16px;
}
@keyframes slideInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}
@media screen and (max-width: 768px) {
  .modern-signup .signup-card {
    width: calc(100vw - 32px) !important;
    margin: 16px;
    border-radius: 16px;
  }
  .modern-signup .signup-header {
    padding: 24px 24px 12px;
  }
  .modern-signup .signup-header .signup-title {
    font-size: 24px;
  }
  .modern-signup .signup-header .signup-subtitle {
    font-size: 14px;
  }
  .modern-signup .signup-content {
    padding: 12px 24px 24px;
  }
  .modern-signup .modern-form .modern-input-container {
    margin-bottom: 20px;
  }
  .modern-signup .modern-primary-button {
    min-width: auto;
    width: 100%;
    padding: 14px 24px;
    font-size: 15px;
  }
}
@media screen and (max-width: 480px) {
  .modern-signup .signup-card {
    width: calc(100vw - 16px) !important;
    margin: 8px;
  }
  .modern-signup .signup-header {
    padding: 20px 20px 10px;
  }
  .modern-signup .signup-header .signup-icon md-icon {
    font-size: 40px;
    height: 40px;
    width: 40px;
  }
  .modern-signup .signup-header .signup-title {
    font-size: 22px;
  }
  .modern-signup .signup-content {
    padding: 10px 20px 20px;
  }
}
.btn-register {
  border-color: #fff;
}
.btn-register.btn-inverse {
  border: 1px solid #428bca !important;
  border-radius: 3px !important;
  color: #fff !important;
  background-color: #428bca !important;
}
/*# sourceMappingURL=/app-public/build/assets/bystro-web-1.0.1.css.map */