.configurator-root {
  background: var(--bg-surface, #f8f9fa);
  -webkit-font-smoothing: antialiased;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
  display: flex;
}

.configurator-body {
  flex: 1;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.cfg-topbar {
  z-index: 10;
  background: #fff;
  border-bottom: 1px solid rgba(0, 0, 0, .07);
  flex-shrink: 0;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  height: 56px;
  padding: 0 1.5rem;
  display: flex;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .04);
}

.cfg-topbar-left {
  align-items: center;
  gap: .75rem;
  min-width: 0;
  display: flex;
}

.cfg-breadcrumb {
  align-items: center;
  gap: .375rem;
  font-size: .875rem;
  display: flex;
}

.cfg-breadcrumb-root {
  color: rgba(25, 28, 29, .45);
  white-space: nowrap;
}

.cfg-breadcrumb-sep {
  color: rgba(25, 28, 29, .25);
}

.cfg-breadcrumb-current {
  color: var(--foreground, #191c1d);
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 240px;
  font-weight: 600;
  overflow: hidden;
}

.cfg-entity-badge {
  color: var(--brand-primary, #004289);
  white-space: nowrap;
  background: rgba(0, 66, 137, .07);
  border: 1px solid rgba(0, 66, 137, .15);
  border-radius: 999px;
  align-items: center;
  gap: .375rem;
  padding: .175rem .625rem;
  font-size: .75rem;
  font-weight: 500;
  display: inline-flex;
}

.cfg-entity-dot {
  background: var(--brand-primary, #004289);
  border-radius: 50%;
  width: 6px;
  height: 6px;
}

.cfg-topbar-nav {
  align-items: center;
  gap: .25rem;
  display: flex;
}

.cfg-nav-btn {
  color: rgba(25, 28, 29, .55);
  cursor: pointer;
  letter-spacing: -.01em;
  background: none;
  border: none;
  border-radius: 6px;
  padding: .375rem .875rem;
  font-size: .8125rem;
  font-weight: 500;
  transition: all .15s;
}

.cfg-nav-btn:hover {
  color: var(--foreground, #191c1d);
  background: rgba(0, 0, 0, .04);
}

.cfg-nav-btn--active {
  color: var(--brand-primary, #004289);
  background: rgba(0, 66, 137, .08);
  font-weight: 600;
}

.cfg-topbar-actions {
  align-items: center;
  gap: .5rem;
  display: flex;
}

.cfg-btn {
  cursor: pointer;
  white-space: nowrap;
  letter-spacing: -.01em;
  border: 1.5px solid rgba(0, 0, 0, 0);
  border-radius: 7px;
  align-items: center;
  gap: .375rem;
  padding: .4375rem .875rem;
  font-size: .8125rem;
  font-weight: 600;
  transition: all .15s;
  display: inline-flex;
}

.cfg-btn--primary {
  color: #fff;
  background: var(--brand-primary, #004289);
  border-color: var(--brand-primary, #004289);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .1), inset 0 1px rgba(255, 255, 255, .1);
}

.cfg-btn--primary:hover {
  background: #003370;
  border-color: #003370;
  box-shadow: 0 3px 8px rgba(0, 66, 137, .25);
}

.cfg-btn--ghost {
  color: rgba(25, 28, 29, .7);
  background: none;
  border-color: rgba(0, 0, 0, .12);
}

.cfg-btn--ghost:hover {
  color: var(--foreground, #191c1d);
  background: rgba(0, 0, 0, .03);
  border-color: rgba(0, 0, 0, .18);
}

.cfg-btn--sm {
  padding: .25rem .625rem;
  font-size: .75rem;
}

.cfg-icon {
  font-size: 1rem;
  line-height: 1;
}

.cfg-sidebar {
  background: #fff;
  border-right: 1px solid rgba(0, 0, 0, .07);
  flex-direction: column;
  flex-shrink: 0;
  width: 220px;
  padding: 1rem 0;
  display: flex;
  overflow-y: auto;
}

.cfg-sidebar-status {
  border-bottom: 1px solid rgba(0, 0, 0, .05);
  margin-bottom: .625rem;
  padding: 0 .875rem .875rem;
}

.cfg-status {
  text-transform: uppercase;
  letter-spacing: .06em;
  border-radius: 999px;
  align-items: center;
  gap: .375rem;
  padding: .175rem .6rem;
  font-size: .7rem;
  font-weight: 700;
  display: inline-flex;
}

.cfg-status--draft {
  color: rgba(25, 28, 29, .5);
  background: rgba(0, 0, 0, .05);
  border: 1px solid rgba(0, 0, 0, .08);
}

.cfg-status--live {
  color: #15803d;
  background: rgba(21, 128, 61, .08);
  border: 1px solid rgba(21, 128, 61, .2);
}

.cfg-sidebar-nav {
  flex-direction: column;
  gap: .125rem;
  padding: 0 .5rem;
  display: flex;
}

.cfg-sidebar-item {
  color: rgba(25, 28, 29, .6);
  cursor: pointer;
  text-align: left;
  background: none;
  border: none;
  border-radius: 7px;
  align-items: center;
  gap: .625rem;
  width: 100%;
  padding: .5rem .75rem;
  font-size: .8125rem;
  font-weight: 500;
  transition: all .12s;
  display: flex;
}

.cfg-sidebar-item:hover {
  color: var(--foreground, #191c1d);
  background: rgba(0, 0, 0, .04);
}

.cfg-sidebar-item--active {
  color: var(--brand-primary, #004289);
  background: rgba(0, 66, 137, .07);
  font-weight: 600;
}

.cfg-sidebar-icon {
  opacity: .75;
  font-size: 1rem;
}

.cfg-sidebar-dims {
  border-top: 1px solid rgba(0, 0, 0, .05);
  margin-top: .75rem;
  padding: .75rem .5rem 0;
}

.cfg-sidebar-dims-header {
  text-transform: uppercase;
  letter-spacing: .06em;
  color: rgba(25, 28, 29, .4);
  justify-content: space-between;
  align-items: center;
  padding: 0 .5rem .375rem;
  font-size: .6875rem;
  font-weight: 700;
  display: flex;
}

.cfg-dim-count {
  color: rgba(25, 28, 29, .5);
  background: rgba(0, 0, 0, .06);
  border-radius: 999px;
  padding: 0 .375rem;
  font-size: .625rem;
  font-weight: 700;
}

.cfg-sidebar-dims-list {
  flex-direction: column;
  gap: .125rem;
  display: flex;
}

.cfg-sidebar-dim {
  color: rgba(25, 28, 29, .65);
  cursor: pointer;
  text-align: left;
  background: none;
  border: none;
  border-radius: 6px;
  align-items: center;
  gap: .5rem;
  width: 100%;
  padding: .375rem .75rem;
  font-size: .78125rem;
  font-weight: 500;
  transition: all .1s;
  display: flex;
}

.cfg-sidebar-dim:hover {
  color: var(--foreground, #191c1d);
  background: rgba(0, 0, 0, .04);
}

.cfg-sidebar-dim--active {
  color: var(--brand-primary, #004289);
  background: rgba(0, 66, 137, .07);
  font-weight: 600;
}

.cfg-dim-name {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.cfg-sidebar-add-dim {
  color: var(--brand-primary, #004289);
  cursor: pointer;
  opacity: .8;
  background: none;
  border: none;
  border-radius: 6px;
  align-items: center;
  gap: .375rem;
  width: 100%;
  margin-top: .125rem;
  padding: .375rem .75rem;
  font-size: .75rem;
  font-weight: 500;
  transition: all .1s;
  display: flex;
}

.cfg-sidebar-add-dim:hover {
  opacity: 1;
  background: rgba(0, 66, 137, .05);
}

.cfg-dim-dot {
  border-radius: 50%;
  flex-shrink: 0;
  width: 6px;
  height: 6px;
}

.cfg-dim-dot--active {
  background: #22c55e;
}

.cfg-dim-dot--inactive {
  background: rgba(0, 0, 0, .18);
}

.cfg-section {
  max-width: 860px;
  padding: 2rem 2.5rem;
}

.cfg-section--split {
  flex: 1;
  gap: 0;
  max-width: none;
  height: 100%;
  padding: 0;
  display: flex;
  overflow: hidden;
}

.cfg-section-header {
  margin-bottom: 1.75rem;
}

.cfg-section-title {
  color: var(--foreground, #191c1d);
  letter-spacing: -.025em;
  margin-bottom: .25rem;
  font-size: 1.0625rem;
  font-weight: 700;
}

.cfg-section-desc {
  color: rgba(25, 28, 29, .5);
  font-size: .8125rem;
  line-height: 1.5;
}

.cfg-form-grid {
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
  display: grid;
}

.cfg-field {
  flex-direction: column;
  gap: .375rem;
  display: flex;
}

.cfg-field--full {
  grid-column: 1 / -1;
}

.cfg-form-row {
  gap: .875rem;
  display: flex;
}

.cfg-form-row .cfg-field {
  flex: 1;
}

.cfg-label {
  color: rgba(25, 28, 29, .7);
  letter-spacing: .01em;
  font-size: .75rem;
  font-weight: 600;
}

.cfg-required {
  color: #ef4444;
  margin-left: .125rem;
}

.cfg-hint {
  color: rgba(25, 28, 29, .42);
  font-size: .71875rem;
  line-height: 1.45;
}

.cfg-error-msg {
  color: #dc2626;
  font-size: .71875rem;
  font-weight: 500;
}

.cfg-input {
  color: var(--foreground, #191c1d);
  background: #fff;
  border: 1.5px solid rgba(0, 0, 0, .12);
  border-radius: 7px;
  outline: none;
  width: 100%;
  padding: .4375rem .6875rem;
  font-family: inherit;
  font-size: .8125rem;
  transition: border-color .15s, box-shadow .15s;
}

.cfg-input:focus {
  border-color: var(--brand-primary, #004289);
  box-shadow: 0 0 0 3px rgba(0, 66, 137, .1);
}

.cfg-input--error {
  border-color: #dc2626;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, .08);
}

.cfg-input--sm {
  padding: .3125rem .5625rem;
  font-size: .75rem;
}

.cfg-input--mono {
  font-family: JetBrains Mono, Fira Code, ui-monospace, monospace;
  font-size: .75rem;
}

.cfg-textarea {
  color: var(--foreground, #191c1d);
  resize: vertical;
  background: #fff;
  border: 1.5px solid rgba(0, 0, 0, .12);
  border-radius: 7px;
  outline: none;
  width: 100%;
  padding: .5rem .6875rem;
  font-family: inherit;
  font-size: .8125rem;
  line-height: 1.5;
  transition: border-color .15s, box-shadow .15s;
}

.cfg-textarea:focus {
  border-color: var(--brand-primary, #004289);
  box-shadow: 0 0 0 3px rgba(0, 66, 137, .1);
}

.cfg-select-wrap {
  position: relative;
}

.cfg-select-wrap:after {
  content: "▾";
  color: rgba(25, 28, 29, .4);
  pointer-events: none;
  font-size: .75rem;
  position: absolute;
  top: 50%;
  right: .625rem;
  transform: translateY(-50%);
}

.cfg-select {
  width: 100%;
  color: var(--foreground, #191c1d);
  appearance: none;
  cursor: pointer;
  background: #fff;
  border: 1.5px solid rgba(0, 0, 0, .12);
  border-radius: 7px;
  outline: none;
  padding: .4375rem 2rem .4375rem .6875rem;
  font-family: inherit;
  font-size: .8125rem;
  transition: border-color .15s, box-shadow .15s;
}

.cfg-select:focus {
  border-color: var(--brand-primary, #004289);
  box-shadow: 0 0 0 3px rgba(0, 66, 137, .1);
}

.cfg-toggle-row {
  border-top: 1px solid rgba(0, 0, 0, .05);
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: .875rem 0;
  display: flex;
}

.cfg-toggle {
  cursor: pointer;
  background: rgba(0, 0, 0, .14);
  border: none;
  border-radius: 999px;
  flex-shrink: 0;
  width: 40px;
  height: 22px;
  padding: 0;
  transition: background .2s;
  position: relative;
}

.cfg-toggle--on {
  background: var(--brand-primary, #004289);
}

.cfg-toggle-thumb {
  background: #fff;
  border-radius: 50%;
  width: 16px;
  height: 16px;
  transition: transform .2s cubic-bezier(.16, 1, .3, 1);
  position: absolute;
  top: 3px;
  left: 3px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
}

.cfg-toggle--on .cfg-toggle-thumb {
  transform: translateX(18px);
}

.cfg-empty-state {
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .75rem;
  padding: 3.5rem 2rem;
  display: flex;
}

.cfg-empty-icon {
  opacity: .25;
  font-size: 2.5rem;
  line-height: 1;
}

.cfg-empty-title {
  color: rgba(25, 28, 29, .6);
  font-size: .9375rem;
  font-weight: 600;
}

.cfg-empty-desc {
  color: rgba(25, 28, 29, .4);
  max-width: 300px;
  font-size: .8125rem;
  line-height: 1.5;
}

.cfg-icon-btn {
  color: rgba(25, 28, 29, .45);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  font-size: .8125rem;
  transition: all .12s;
  display: inline-flex;
}

.cfg-icon-btn:hover {
  color: var(--foreground, #191c1d);
  background: rgba(0, 0, 0, .06);
}

.cfg-icon-btn:disabled {
  opacity: .25;
  cursor: default;
}

.cfg-icon-btn--danger:hover {
  color: #dc2626;
  background: rgba(220, 38, 38, .07);
}

.cfg-dim-list-panel {
  background: #fff;
  border-right: 1px solid rgba(0, 0, 0, .07);
  flex-shrink: 0;
  width: 360px;
  padding: 1.5rem;
  overflow-y: auto;
}

.cfg-dim-list {
  flex-direction: column;
  gap: .25rem;
  margin-bottom: .875rem;
  display: flex;
}

.cfg-dim-row {
  border: 1.5px solid rgba(0, 0, 0, 0);
  border-radius: 8px;
  align-items: center;
  gap: .5rem;
  padding: .5rem .375rem;
  transition: all .12s;
  display: flex;
}

.cfg-dim-row:hover {
  background: rgba(0, 0, 0, .02);
}

.cfg-dim-row--active {
  background: rgba(0, 66, 137, .04);
  border-color: rgba(0, 66, 137, .15);
}

.cfg-dim-reorder {
  flex-direction: column;
  display: flex;
}

.cfg-dim-reorder .cfg-icon-btn {
  width: 20px;
  height: 18px;
  font-size: .5625rem;
}

.cfg-dim-summary {
  text-align: left;
  cursor: pointer;
  background: none;
  border: none;
  flex-direction: column;
  flex: 1;
  gap: .25rem;
  min-width: 0;
  padding: 0;
  display: flex;
}

.cfg-dim-summary-main {
  align-items: center;
  gap: .5rem;
  display: flex;
}

.cfg-dim-summary-name {
  color: var(--foreground, #191c1d);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .8125rem;
  font-weight: 600;
  overflow: hidden;
}

.cfg-dim-summary-type {
  color: rgba(25, 28, 29, .4);
  white-space: nowrap;
  background: rgba(0, 0, 0, .05);
  border-radius: 4px;
  padding: .1rem .4rem;
  font-size: .6875rem;
  font-weight: 500;
}

.cfg-dim-summary-meta {
  flex-wrap: wrap;
  align-items: center;
  gap: .375rem;
  display: flex;
}

.cfg-dim-meta-pill {
  color: rgba(25, 28, 29, .38);
  white-space: nowrap;
  background: rgba(0, 0, 0, .04);
  border-radius: 4px;
  padding: .0625rem .375rem;
  font-size: .65rem;
  font-weight: 500;
}

.cfg-dim-row-actions {
  align-items: center;
  display: flex;
}

.cfg-add-dim-btn {
  color: var(--brand-primary, #004289);
  cursor: pointer;
  background: none;
  border: 1.5px dashed rgba(0, 66, 137, .25);
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  gap: .375rem;
  width: 100%;
  margin-top: .5rem;
  padding: .5rem .75rem;
  font-size: .8125rem;
  font-weight: 500;
  transition: all .15s;
  display: flex;
}

.cfg-add-dim-btn:hover {
  border-color: var(--brand-primary, #004289);
  background: rgba(0, 66, 137, .04);
}

.cfg-dim-editor-panel {
  background: var(--bg-surface, #f8f9fa);
  flex: 1;
  min-width: 0;
  overflow-y: auto;
}

.cfg-dim-editor-empty {
  color: rgba(25, 28, 29, .3);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .625rem;
  height: 100%;
  font-size: .875rem;
  display: flex;
}

.cfg-dim-editor {
  flex-direction: column;
  height: 100%;
  display: flex;
}

.cfg-dim-editor-header {
  background: #fff;
  border-bottom: 1px solid rgba(0, 0, 0, .07);
  flex-shrink: 0;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1.5rem;
  display: flex;
}

.cfg-dim-editor-title {
  color: var(--foreground, #191c1d);
  letter-spacing: -.02em;
  font-size: .9375rem;
  font-weight: 700;
}

.cfg-dim-editor-body {
  flex-direction: column;
  flex: 1;
  gap: .75rem;
  padding: 1.25rem 1.5rem;
  display: flex;
  overflow-y: auto;
}

.cfg-editor-section {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, .07);
  border-radius: 10px;
  flex-direction: column;
  gap: .875rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.cfg-editor-section-title {
  text-transform: uppercase;
  letter-spacing: .065em;
  color: rgba(25, 28, 29, .4);
  margin-bottom: 0;
  font-size: .6875rem;
  font-weight: 700;
}

.cfg-editor-section-header {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.cfg-options-list {
  flex-direction: column;
  gap: .375rem;
  display: flex;
}

.cfg-option-row {
  align-items: center;
  gap: .5rem;
  display: flex;
}

.cfg-option-drag {
  color: rgba(25, 28, 29, .25);
  cursor: grab;
  -webkit-user-select: none;
  user-select: none;
  flex-shrink: 0;
  font-size: .875rem;
}

.cfg-combinator-grid {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, .07);
  border-radius: 10px;
  flex-direction: column;
  gap: 0;
  display: flex;
  overflow: hidden;
}

.cfg-combinator-header {
  text-transform: uppercase;
  letter-spacing: .06em;
  color: rgba(25, 28, 29, .45);
  background: rgba(0, 0, 0, .02);
  border-bottom: 1px solid rgba(0, 0, 0, .06);
  grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
  gap: .75rem;
  padding: .625rem 1rem;
  font-size: .6875rem;
  font-weight: 700;
  display: grid;
}

.cfg-combinator-row {
  border-bottom: 1px solid rgba(0, 0, 0, .04);
  grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
  align-items: center;
  gap: .75rem;
  padding: .625rem 1rem;
  transition: background .1s;
  display: grid;
}

.cfg-combinator-row:last-of-type {
  border-bottom: none;
}

.cfg-combinator-row:hover {
  background: rgba(0, 66, 137, .02);
}

.cfg-combinator-dim-name {
  color: var(--foreground, #191c1d);
  align-items: center;
  gap: .5rem;
  min-width: 0;
  font-size: .8125rem;
  font-weight: 500;
  display: flex;
}

.cfg-combinator-range-hint {
  color: rgba(25, 28, 29, .35);
  white-space: nowrap;
  font-size: .6875rem;
}

.cfg-combinator-note {
  color: rgba(25, 28, 29, .55);
  background: rgba(0, 66, 137, .03);
  border-top: 1px solid rgba(0, 66, 137, .08);
  align-items: flex-start;
  gap: .625rem;
  padding: .875rem 1rem;
  font-size: .75rem;
  line-height: 1.5;
  display: flex;
}

.cfg-combinator-note code {
  background: rgba(0, 0, 0, .06);
  border-radius: 3px;
  padding: .1rem .3rem;
  font-family: JetBrains Mono, Fira Code, ui-monospace, monospace;
  font-size: .6875rem;
}

.cfg-combinator-note-icon {
  opacity: .5;
  flex-shrink: 0;
  margin-top: .0625rem;
  font-size: .9375rem;
}

.scorecard-widget {
  color: var(--text-primary, #e8eaed);
  flex-direction: column;
  gap: 14px;
  padding: 4px 0;
  font-size: 13px;
  display: flex;
}

.sw-header {
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  display: flex;
}

.sw-header-main {
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  display: flex;
}

.sw-title {
  color: var(--text-primary, #e8eaed);
  margin: 0;
  font-size: 15px;
  font-weight: 700;
}

.sw-subject {
  color: var(--text-muted, #9aa0a6);
  font-size: 12px;
}

.sw-header-actions {
  flex-shrink: 0;
  gap: 8px;
  display: flex;
}

.sw-dimensions {
  flex-direction: column;
  gap: 12px;
  display: flex;
}

.sw-dim-row {
  border: 1px solid var(--border-default, rgba(255, 255, 255, .1));
  background: var(--bg-elevated, rgba(255, 255, 255, .03));
  border-radius: 8px;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
  display: flex;
}

.sw-dim-row--required-unrated {
  border-color: rgba(248, 113, 113, .45);
}

.sw-dim-row--inferred {
  border-color: rgba(96, 165, 250, .4);
}

.sw-dim-header {
  flex-direction: column;
  gap: 4px;
  display: flex;
}

.sw-dim-name-row {
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  display: flex;
}

.sw-dim-name {
  color: var(--text-primary, #e8eaed);
  font-weight: 600;
}

.sw-dim-required {
  color: #f87171;
  font-weight: 700;
}

.sw-dim-inverted-badge, .sw-ai-badge {
  border: 1px solid var(--border-default, rgba(255, 255, 255, .12));
  color: var(--text-muted, #9aa0a6);
  border-radius: 3px;
  padding: 2px 6px;
  font-size: 10px;
  font-weight: 600;
}

.sw-dim-desc {
  color: var(--text-muted, #9aa0a6);
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
}

.sw-input {
  flex-direction: column;
  gap: 6px;
  display: flex;
}

.sw-input--boolean {
  flex-direction: row;
  gap: 8px;
}

.sw-bool-btn {
  border: 1px solid var(--border-default, rgba(255, 255, 255, .12));
  color: var(--text-secondary, #c4c7c5);
  cursor: pointer;
  background: none;
  border-radius: 6px;
  flex: 1;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 600;
}

.sw-bool-btn--active.sw-bool-btn--yes {
  color: #6ee7b7;
  background: rgba(52, 211, 153, .12);
  border-color: rgba(52, 211, 153, .55);
}

.sw-bool-btn--active.sw-bool-btn--no {
  color: #fca5a5;
  background: rgba(248, 113, 113, .12);
  border-color: rgba(248, 113, 113, .55);
}

.sw-slider {
  width: 100%;
  accent-color: var(--text-link, #60a5fa);
  cursor: pointer;
}

.sw-slider-labels {
  color: var(--text-muted, #9aa0a6);
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  display: flex;
}

.sw-slider-current {
  color: var(--text-primary, #e8eaed);
  font-family: ui-monospace, monospace;
  font-weight: 700;
}

.sw-input--numeric .cfg-input, .sw-input--numeric input {
  border: 1px solid var(--border-default, rgba(255, 255, 255, .12));
  background: var(--bg-elevated, transparent);
  width: 100%;
  max-width: 220px;
  color: var(--text-primary, #e8eaed);
  border-radius: 6px;
  padding: 7px 10px;
  font-size: 13px;
}

.sw-alert-banners {
  flex-direction: column;
  gap: 6px;
  display: flex;
}

.sw-alert-banner {
  color: #fbbf24;
  background: rgba(251, 191, 36, .08);
  border: 1px solid rgba(251, 191, 36, .35);
  border-radius: 6px;
  align-items: flex-start;
  gap: 8px;
  padding: 8px 10px;
  font-size: 12px;
  display: flex;
}

.sw-error-banner {
  color: #f87171;
  background: rgba(248, 113, 113, .1);
  border: 1px solid rgba(248, 113, 113, .4);
  border-radius: 6px;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  font-size: 12px;
  display: flex;
}

.sw-footer {
  border-top: 1px solid var(--border-default, rgba(255, 255, 255, .08));
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding-top: 4px;
  display: flex;
}

.sw-footer-left {
  min-width: 0;
}

.sw-required-count {
  color: #f87171;
  font-size: 11px;
}

.sw-footer-actions {
  flex-shrink: 0;
  gap: 8px;
  display: flex;
}

.sw-upload-zone {
  border: 1px dashed var(--border-default, rgba(255, 255, 255, .2));
  text-align: center;
  background: rgba(255, 255, 255, .02);
  border-radius: 8px;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 20px 16px;
  display: flex;
}

.sw-upload-zone--hover {
  border-color: var(--text-link, #60a5fa);
  background: rgba(96, 165, 250, .06);
}

.sw-upload-title {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
}

.sw-upload-hint {
  color: var(--text-muted, #9aa0a6);
  max-width: 420px;
  margin: 0;
  font-size: 11px;
}

.sw-inference-actions {
  color: var(--text-muted, #9aa0a6);
  align-items: center;
  gap: 8px;
  font-size: 11px;
  display: flex;
}

.nudge-prompt {
  z-index: 80;
  background: var(--folio-surface, #0f172a);
  border: 1px solid var(--folio-border, #1e293b);
  width: min(22rem, 100vw - 2rem);
  color: var(--folio-fg, #e2e8f0);
  border-radius: 12px;
  padding: 1rem 1.1rem;
  position: fixed;
  bottom: 1.25rem;
  right: 1.25rem;
  box-shadow: 0 12px 40px rgba(0, 0, 0, .35);
}

.nudge-header {
  justify-content: space-between;
  align-items: flex-start;
  gap: .75rem;
  margin-bottom: .85rem;
  display: flex;
}

.nudge-mode-badge {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--cobalt, #3b82f6);
  margin-bottom: .25rem;
  font-size: .65rem;
  font-weight: 700;
  display: inline-block;
}

.nudge-title {
  font-size: .95rem;
  font-weight: 600;
  line-height: 1.3;
}

.nudge-subtitle {
  color: var(--folio-muted, #94a3b8);
  margin-top: .15rem;
  font-size: .8rem;
}

.nudge-dismiss {
  flex-shrink: 0;
}

.nudge-dimensions {
  flex-direction: column;
  gap: .75rem;
  margin-bottom: .9rem;
  display: flex;
}

.nudge-dim-row {
  flex-direction: column;
  gap: .35rem;
  display: flex;
}

.nudge-dim-header {
  align-items: center;
  gap: .4rem;
  display: flex;
}

.nudge-dim-name {
  font-size: .85rem;
  font-weight: 500;
}

.nudge-dim-required {
  color: #f87171;
  font-size: .65rem;
}

.nudge-ai-badge {
  color: #a78bfa;
  font-size: .65rem;
}

.nudge-footer {
  justify-content: flex-end;
  gap: .5rem;
  display: flex;
}

.nudge-input--rating input {
  border: 1px solid var(--folio-border, #334155);
  width: 100%;
  color: inherit;
  background: none;
  border-radius: 8px;
  padding: .4rem .55rem;
}

.nudge-input input[type="number"] {
  border: 1px solid var(--folio-border, #334155);
  width: 100%;
  color: inherit;
  background: none;
  border-radius: 8px;
  padding: .4rem .55rem;
}

.nudge-input--boolean {
  gap: .5rem;
  display: flex;
}

.nudge-bool-btn {
  border: 1px solid var(--folio-border, #334155);
  color: inherit;
  cursor: pointer;
  background: none;
  border-radius: 8px;
  flex: 1;
  padding: .4rem;
}

.nudge-bool-btn--active {
  border-color: var(--cobalt, #3b82f6);
  background: rgba(59, 130, 246, .15);
}

.nudge-inference-actions {
  flex-direction: column;
  gap: .35rem;
  display: flex;
}

.nudge-inference-evidence {
  color: var(--folio-muted, #94a3b8);
  font-size: .75rem;
}

:root {
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light;
  --eo: cubic-bezier(.23, 1, .32, 1);
  --eio: cubic-bezier(.77, 0, .175, 1);
  --surface: #f7f9fb;
  --surface-container-low: #f2f4f6;
  --surface-container: #eceef0;
  --surface-container-high: #e6e8ea;
  --surface-container-highest: #e0e3e5;
  --surface-container-lowest: #fff;
  --on-surface: #191c1e;
  --on-surface-variant: #45464d;
  --outline: #76777d;
  --outline-variant: #c6c6cd;
  --primary: #131b2e;
  --on-primary: #fff;
  --primary-hover: #2d3133;
  --error: #ba1a1a;
  --error-container: #ffdad6;
  --on-error-container: #93000a;
  --warning: #b26a00;
  --warning-container: #ffddb0;
  --on-warning-container: #5c4400;
  --green: #069669;
  --green-container: rgba(104, 219, 169, .2);
  --green-bright: #68dba9;
  --btc: #f7931a;
  --btc-ink: #a85e00;
  --red: var(--error);
  --amber: var(--warning);
  --navy: var(--primary);
  --ink: var(--on-surface);
  --mut: var(--on-surface-variant);
  --dim: var(--outline);
  --line: var(--outline-variant);
  --surf: var(--surface-container-lowest);
  --folio-bg: var(--surface);
  --folio-surface: var(--surface-container-lowest);
  --folio-border: var(--outline-variant);
  --folio-accent: var(--primary);
  --folio-accent2: var(--btc);
  --folio-text: var(--on-surface);
  --folio-muted: var(--on-surface-variant);
  --folio-nav-w: 16rem;
  --folio-radius: 10px;
  --ease-out: var(--eo);
  --folio-text-page: 1.7rem;
  --folio-text-page-weight: 800;
  --folio-text-subtitle: .875rem;
  --folio-text-subtitle-weight: 500;
  --folio-text-section: .8125rem;
  --folio-text-section-weight: 700;
  --folio-text-label: .75rem;
  --folio-text-label-weight: 700;
  --folio-text-body: .875rem;
  --folio-text-input: .9rem;
  --folio-text-btn: .78rem;
  --folio-text-btn-weight: 600;
  --folio-text-tab: .75rem;
  --folio-text-tab-weight: 600;
}

html[data-theme="dark"], html.dark {
  --lightningcss-light: ;
  --lightningcss-dark: initial;
  color-scheme: dark;
  --surface: #05070d;
  --surface-container-low: #0d1420;
  --surface-container: #0f1825;
  --surface-container-high: #131c2e;
  --surface-container-highest: #182236;
  --surface-container-lowest: #0a0f1b;
  --on-surface: #e9edf6;
  --on-surface-variant: #8a97b0;
  --outline: #6b7690;
  --outline-variant: #1b202b;
  --primary: #e8edf5;
  --on-primary: #0f1825;
  --primary-hover: #c5cedd;
  --error: #ffb4ab;
  --error-container: #93000a;
  --on-error-container: #ffdad6;
  --warning: #f0b45c;
  --warning-container: #5c4400;
  --on-warning-container: #ffddb0;
  --green: #5fd6a4;
  --green-container: rgba(104, 219, 169, .14);
  --green-bright: #68dba9;
  --btc: #f7931a;
  --btc-ink: #ffc56b;
  --navy: #131b2e;
}

body {
  background: var(--surface);
  color: var(--on-surface);
  font-family: Inter, sans-serif;
}

::selection {
  background: var(--navy);
  color: #fff;
}

.ms {
  letter-spacing: normal;
  text-transform: none;
  white-space: nowrap;
  -webkit-font-smoothing: antialiased;
  direction: ltr;
  font-family: Material Symbols Outlined;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  display: inline-block;
}

.card {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .35);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(25, 28, 30, .04);
}

.btn {
  cursor: pointer;
  transition: transform .16s var(--eo), background-color .15s, color .15s, border-color .15s;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .5rem;
  align-items: center;
  gap: .4rem;
  padding: .5rem .85rem;
  font-size: .78rem;
  font-weight: 600;
  display: inline-flex;
}

.btn:active {
  transform: scale(.97);
}

.btn-p {
  background: var(--primary);
  color: var(--on-primary);
}

.btn-p:hover {
  background: var(--primary-hover);
}

.btn-g {
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  border-color: rgba(198, 198, 205, .6);
}

.btn-g:hover {
  background: var(--surface-container-low);
}

.btn-o {
  background: var(--btc);
  color: var(--navy);
}

.btn-o:hover {
  background: #e0870f;
}

.btn-xs {
  border-radius: .45rem;
  padding: .35rem .65rem;
  font-size: .72rem;
}

.icobtn {
  width: 30px;
  height: 30px;
  color: var(--outline);
  cursor: pointer;
  transition: background .15s,color .15s,transform .16s var(--eo);
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.icobtn:hover {
  background: var(--surface-container);
  color: var(--on-surface);
}

.icobtn:active {
  transform: scale(.94);
}

:where(a, button, summary, select, [role="tab"]):focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
  border-radius: 6px;
}

:where(input:not(.input), select:not(.select)):focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
  border-radius: 6px;
}

.chip {
  letter-spacing: .05em;
  text-transform: uppercase;
  white-space: nowrap;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .375rem;
  align-items: center;
  gap: .3rem;
  padding: .18rem .45rem;
  font-size: .62rem;
  font-weight: 700;
  display: inline-flex;
}

.chip-red {
  background: var(--error-container);
  color: var(--on-error-container);
  border-color: #f2b8b5;
}

.chip-amber {
  background: var(--warning-container);
  color: var(--on-warning-container);
  border-color: #eec27a;
}

.chip-btc {
  color: var(--btc-ink);
  background: rgba(247, 147, 26, .14);
  border-color: rgba(247, 147, 26, .35);
}

.seg {
  background: var(--surface-container-high);
  border-radius: 10px;
  gap: 2px;
  padding: 3px;
  display: inline-flex;
}

.seg [role="tab"] {
  color: var(--on-surface-variant);
  cursor: pointer;
  transition: background .18s var(--eo), color .18s;
  border-radius: 8px;
  align-items: center;
  gap: .4rem;
  padding: .35rem .8rem;
  font-size: .75rem;
  font-weight: 600;
  display: inline-flex;
}

.seg [role="tab"][aria-selected="true"] {
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  box-shadow: 0 1px 2px rgba(25, 28, 30, .1);
}

.seg .cnt {
  color: var(--outline);
  font-variant-numeric: tabular-nums;
  background: rgba(25, 28, 30, .06);
  border-radius: 99px;
  padding: .05rem .34rem;
  font-size: .62rem;
  font-weight: 700;
}

.seg [role="tab"][aria-selected="true"] .cnt {
  background: var(--navy);
  color: #fff;
}

.seg.mini [role="tab"] {
  padding: .22rem .6rem;
  font-size: .68rem;
}

.seg.seg-dark {
  background: rgba(255, 255, 255, .12);
}

.seg.seg-dark [role="tab"] {
  color: rgba(255, 255, 255, .65);
}

.seg.seg-dark [role="tab"][aria-selected="true"] {
  color: var(--navy);
  background: rgba(255, 255, 255, .92);
}

@media (width <= 480px) {
  .seg {
    scrollbar-width: none;
    max-width: 100%;
    overflow-x: auto;
  }

  .seg::-webkit-scrollbar {
    display: none;
  }

  .seg [role="tab"] {
    white-space: nowrap;
    flex-shrink: 0;
  }
}

.sgroup {
  letter-spacing: .1em;
  color: var(--outline);
  text-transform: uppercase;
  padding: 1.1rem .65rem .35rem;
  font-size: .58rem;
  font-weight: 800;
}

.slink {
  color: var(--on-surface-variant);
  border-radius: .5rem;
  align-items: center;
  gap: .7rem;
  padding: .5rem .65rem;
  font-size: .8rem;
  font-weight: 500;
  text-decoration: none;
  transition: background .15s;
  display: flex;
}

.slink:hover {
  background: var(--surface-container-low);
}

.slink.on {
  background: var(--surface-container-high);
  color: var(--on-surface);
  box-shadow: inset 2.5px 0 0 var(--primary);
  font-weight: 600;
}

.slink .material-symbols-outlined, .slink .ms {
  font-size: 19px;
}

.slink .badge {
  background: var(--on-error-container);
  color: #fff;
  font-variant-numeric: tabular-nums;
  border-radius: 99px;
  margin-left: auto;
  padding: .1rem .4rem;
  font-size: 9px;
  font-weight: 700;
}

details.new {
  position: relative;
}

details.new summary {
  cursor: pointer;
  list-style: none;
}

details.new summary::-webkit-details-marker {
  display: none;
}

details.new .newmenu {
  background: var(--surface-container-lowest);
  z-index: 20;
  border: 1px solid rgba(198, 198, 205, .5);
  border-radius: 10px;
  padding: 4px;
  position: absolute;
  bottom: calc(100% + 6px);
  left: 0;
  right: 0;
  box-shadow: 0 10px 28px rgba(25, 28, 30, .14);
}

details.new[open] .newmenu {
  animation: pop .18s var(--eo);
}

@keyframes pop {
  from {
    opacity: 0;
    transform: translateY(4px) scale(.98);
  }
}

.nmi {
  color: var(--on-surface);
  border-radius: 7px;
  align-items: center;
  gap: .55rem;
  padding: .45rem .55rem;
  font-size: .76rem;
  font-weight: 500;
  text-decoration: none;
  display: flex;
}

.nmi:hover {
  background: var(--surface-container-low);
}

.nmi .material-symbols-outlined, .nmi .ms {
  color: var(--outline);
  font-size: 17px;
}

.kpi {
  flex-direction: column;
  padding: 1rem;
  display: flex;
}

.kpi-ico {
  background: var(--surface-container);
  width: 30px;
  height: 30px;
  color: var(--on-surface-variant);
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.kpi-ico .material-symbols-outlined, .kpi-ico .ms {
  font-size: 18px;
}

.kpi-num {
  letter-spacing: -.02em;
  margin-top: .6rem;
  font-size: 1.65rem;
  font-weight: 800;
  line-height: 1.15;
}

.kpi-den {
  color: var(--outline);
  letter-spacing: 0;
  font-size: 1rem;
  font-weight: 600;
}

.kpi-lbl {
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--on-surface-variant);
  margin-top: .1rem;
  font-size: .66rem;
  font-weight: 700;
}

.kpi-sub {
  color: var(--outline);
  margin-top: .15rem;
  font-size: .72rem;
}

.meter {
  background: var(--surface-container-high);
  border-radius: 99px;
  gap: 2px;
  height: 6px;
  display: flex;
  overflow: hidden;
}

.meter > i {
  background: var(--navy);
  border-radius: 99px;
  height: 100%;
  display: block;
}

.meter > i.warn {
  background: var(--warning);
}

.meter > i.good {
  background: var(--green);
}

.meter > i.bad {
  background: var(--error);
}

.tbl th {
  z-index: 1;
  background: var(--surface-container-lowest);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--outline);
  text-align: left;
  border-bottom: 1px solid rgba(198, 198, 205, .45);
  padding: .65rem 1rem;
  font-size: .62rem;
  font-weight: 800;
  position: sticky;
  top: 0;
}

.tbl td {
  vertical-align: middle;
  border-bottom: 1px solid rgba(198, 198, 205, .25);
  padding: .8rem 1rem;
}

.tbl tr:last-child td {
  border-bottom: 0;
}

@media (hover: hover) {
  .tbl tbody tr {
    transition: background .12s;
  }

  .tbl tbody tr:hover, .att-row:hover, .job-row:hover {
    background: var(--surface);
  }

  .row-act {
    opacity: 0;
    transition: opacity .15s;
  }

  tr:hover .row-act, .job-row:hover .row-act {
    opacity: 1;
  }

  tr:focus-within .row-act {
    opacity: 1;
  }

  .job-row:focus-within .row-act {
    opacity: 1;
  }
}

a.card {
  transition: transform .16s var(--eo), box-shadow .16s;
}

@media (hover: hover) {
  a.card:hover {
    box-shadow: 0 4px 14px rgba(25, 28, 30, .08);
  }
}

.stagger > * {
  animation: rise .38s var(--eo) both;
}

.stagger > :nth-child(2) {
  animation-delay: 45ms;
}

.stagger > :nth-child(3) {
  animation-delay: 90ms;
}

.stagger > :nth-child(4) {
  animation-delay: .135s;
}

.stagger > :nth-child(5) {
  animation-delay: .18s;
}

.stagger > :nth-child(6) {
  animation-delay: .225s;
}

.stagger > :nth-child(7) {
  animation-delay: .27s;
}

@keyframes rise {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
}

#mobile-sidebar {
  transition: transform .3s var(--eio);
}

#sidebar-overlay {
  transition: opacity .25s;
}

.bnav {
  z-index: 30;
  background: var(--surface-container-lowest);
  border-top: 1px solid color-mix(in srgb, var(--outline-variant) 30%, transparent);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  display: flex;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
}

.bnav-item {
  color: var(--on-surface-variant);
  text-transform: uppercase;
  letter-spacing: .05em;
  flex-direction: column;
  flex: 1;
  align-items: center;
  gap: .2rem;
  padding: .5rem .25rem;
  font-size: .55rem;
  font-weight: 700;
  text-decoration: none;
  display: flex;
  position: relative;
}

.bnav-item.active {
  color: var(--navy);
}

.bnav-item .material-symbols-outlined, .bnav-item .ms {
  font-size: 22px;
}

.bnav-item .bdot {
  background: var(--on-error-container);
  border-radius: 99px;
  width: .55rem;
  height: .55rem;
  margin-right: -1.1rem;
  position: absolute;
  top: .35rem;
  right: 50%;
}

@media (width >= 1024px) {
  .bnav {
    display: none;
  }
}

.att-ico {
  border-radius: 9px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 34px;
  height: 34px;
  display: flex;
}

.att-ico .material-symbols-outlined, .att-ico .ms {
  font-size: 18px;
}

.tone-red {
  background: var(--error-container);
  color: var(--on-error-container);
}

.tone-amber {
  background: var(--warning-container);
  color: var(--on-warning-container);
}

.tone-green {
  color: var(--green);
  background: rgba(104, 219, 169, .22);
}

.tone-neutral {
  background: var(--surface-container);
  color: var(--on-surface-variant);
}

.tone-blue {
  color: var(--navy);
  background: #dce4f0;
}

.att-row {
  align-items: center;
  gap: .75rem;
  padding: .7rem 1rem;
  display: flex;
}

.att-row + .att-row {
  border-top: 1px solid rgba(198, 198, 205, .25);
}

.job-row {
  align-items: flex-start;
  gap: .9rem;
  padding: .9rem 1rem;
  display: flex;
}

.job-row + .job-row {
  border-top: 1px solid rgba(198, 198, 205, .25);
}

.spark {
  width: 100%;
  height: 26px;
  margin-top: .55rem;
  display: block;
}

.field {
  margin-bottom: 1rem;
}

.field:last-child {
  margin-bottom: 0;
}

.field > label, .field-label {
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--on-surface-variant);
  margin-bottom: .45rem;
  font-size: .66rem;
  font-weight: 700;
  display: block;
}

.field .hint {
  color: var(--outline);
  text-transform: none;
  letter-spacing: 0;
  margin-top: .35rem;
  font-size: .72rem;
  font-weight: 400;
}

input.input, textarea.input, select.select, select.input {
  appearance: none;
  box-sizing: border-box;
  background-color: var(--surface-container);
  width: 100%;
  min-height: 2.75rem;
  color: var(--on-surface);
  box-shadow: none;
  transition: background-color .18s var(--eo), box-shadow .18s var(--eo), color .15s;
  border: none;
  border-radius: 12px;
  outline: none;
  padding: .8rem 1rem;
  font-family: Inter, sans-serif;
  font-size: .9rem;
  line-height: 1.4;
}

textarea.input {
  resize: vertical;
  min-height: 6.5rem;
  padding-top: .85rem;
}

input.input::-moz-placeholder {
  color: #8b8c93;
}

textarea.input::-moz-placeholder {
  color: #8b8c93;
}

input.input::placeholder {
  color: #8b8c93;
}

textarea.input::placeholder {
  color: #8b8c93;
}

@media (hover: hover) {
  input.input:hover, textarea.input:hover, select.select:hover, select.input:hover {
    background-color: var(--surface-container-high);
  }
}

input.input:focus, textarea.input:focus, select.select:focus, select.input:focus {
  background-color: var(--surface-container-lowest);
  box-shadow: 0 0 0 2px var(--surface-container-lowest), 0 0 0 4px rgba(19, 27, 46, .28);
  outline: none;
}

input.input:focus-visible {
  background-color: var(--surface-container-lowest);
  box-shadow: 0 0 0 2px var(--surface-container-lowest), 0 0 0 4px rgba(19, 27, 46, .28);
  outline: none;
}

textarea.input:focus-visible {
  background-color: var(--surface-container-lowest);
  box-shadow: 0 0 0 2px var(--surface-container-lowest), 0 0 0 4px rgba(19, 27, 46, .28);
  outline: none;
}

select.select:focus-visible {
  background-color: var(--surface-container-lowest);
  box-shadow: 0 0 0 2px var(--surface-container-lowest), 0 0 0 4px rgba(19, 27, 46, .28);
  outline: none;
}

select.input:focus-visible {
  background-color: var(--surface-container-lowest);
  box-shadow: 0 0 0 2px var(--surface-container-lowest), 0 0 0 4px rgba(19, 27, 46, .28);
  outline: none;
}

.select, select.select, select.input {
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24'%3E%3Cpath fill='%2345464d' d='M8.12 9.29 12 13.17l3.88-3.88a.996.996 0 1 1 1.41 1.41l-4.59 4.59a.996.996 0 0 1-1.41 0L6.7 10.7a.996.996 0 0 1 0-1.41c.39-.38 1.02-.39 1.42 0z'/%3E%3C/svg%3E");
  background-position: right 1rem center;
  background-repeat: no-repeat;
  padding-right: 2.6rem;
}

.field-row {
  grid-template-columns: 1fr;
  gap: 0 .9rem;
  display: grid;
}

@media (width >= 640px) {
  .field-row {
    grid-template-columns: 1fr 1fr;
  }
}

.tog {
  background: var(--outline-variant);
  cursor: pointer;
  width: 42px;
  height: 23px;
  transition: background .2s var(--eo);
  border: none;
  border-radius: 12px;
  flex-shrink: 0;
  padding: 0;
  position: relative;
}

.tog:after {
  content: "";
  background: var(--surface-container-lowest);
  width: 17px;
  height: 17px;
  transition: transform .2s var(--eo);
  border-radius: 50%;
  position: absolute;
  top: 3px;
  left: 3px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
}

.tog.on {
  background: var(--navy);
}

.tog.on:after {
  transform: translateX(19px);
}

.opt-grid {
  grid-template-columns: 1fr;
  gap: .6rem;
  display: grid;
}

@media (width >= 520px) {
  .opt-grid.g2 {
    grid-template-columns: 1fr 1fr;
  }

  .opt-grid.g3 {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

.opt {
  border: 1.5px solid var(--outline-variant);
  cursor: pointer;
  background: var(--surface-container-lowest);
  text-align: left;
  border-radius: .6rem;
  flex-direction: column;
  gap: .4rem;
  padding: .75rem .9rem;
  transition: border-color .15s, background-color .15s;
  display: flex;
}

@media (hover: hover) {
  .opt:hover {
    border-color: var(--primary);
  }
}

.opt.sel {
  border-color: var(--primary);
  background: rgba(19, 27, 46, .04);
}

.opt .material-symbols-outlined, .opt .ms {
  color: var(--on-surface-variant);
  font-size: 21px;
}

.opt.sel .material-symbols-outlined, .opt.sel .ms {
  color: var(--navy);
}

.opt-row {
  align-items: center;
  gap: .5rem;
  width: 100%;
  display: flex;
}

.opt-chk {
  border: 1.5px solid var(--outline-variant);
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  margin-left: auto;
  transition: all .15s;
  display: flex;
}

.opt.sel .opt-chk {
  background: var(--navy);
  border-color: var(--primary);
}

.opt.sel .opt-chk:after {
  content: "";
  background: var(--surface-container-lowest);
  border-radius: 50%;
  width: 6px;
  height: 6px;
}

.opt-label {
  color: var(--on-surface);
  font-size: .8rem;
  font-weight: 600;
}

.opt-desc {
  color: var(--outline);
  font-size: .72rem;
  line-height: 1.45;
}

.wz-top {
  z-index: 40;
  background: var(--surface-container-lowest);
  border-bottom: 1px solid rgba(198, 198, 205, .45);
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  height: 56px;
  padding: 0 1.25rem;
  display: flex;
  position: sticky;
  top: 0;
}

.wz-progress {
  background: var(--surface-container-high);
  z-index: 40;
  height: 3px;
  display: block;
  position: relative;
}

.wz-progress > i {
  background: var(--navy);
  width: 0;
  height: 100%;
  transition: width .35s var(--eo);
  border-radius: 0 99px 99px 0;
  display: block;
}

.wz-shell {
  grid-template-columns: 1fr;
  min-height: calc(100vh - 59px);
  display: grid;
}

@media (width >= 960px) {
  .wz-shell {
    grid-template-columns: 360px 1fr;
    height: calc(100vh - 59px);
    overflow: hidden;
  }
}

.wz-ctx {
  display: none;
}

@media (width >= 960px) {
  .wz-ctx {
    background: var(--navy);
    color: #fff;
    flex-direction: column;
    padding: 2.5rem 2rem;
    display: flex;
    position: relative;
    overflow-y: auto;
  }
}

.wz-ctx:before {
  content: "";
  pointer-events: none;
  background: radial-gradient(at 70% 0, rgba(104, 219, 169, .14) 0%, rgba(0, 0, 0, 0) 55%), radial-gradient(at 20% 95%, rgba(247, 147, 26, .1) 0%, rgba(0, 0, 0, 0) 50%);
  position: absolute;
  inset: 0;
}

.wz-ctx-in {
  z-index: 1;
  flex-direction: column;
  height: 100%;
  display: flex;
  position: relative;
}

.wz-ctx-tag {
  text-transform: uppercase;
  letter-spacing: .1em;
  color: rgba(255, 255, 255, .4);
  margin-bottom: 1.75rem;
  font-size: .66rem;
  font-weight: 700;
}

.wz-ctx-ico {
  background: rgba(255, 255, 255, .07);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 14px;
  justify-content: center;
  align-items: center;
  width: 52px;
  height: 52px;
  margin-bottom: 1.1rem;
  display: flex;
}

.wz-ctx-ico .material-symbols-outlined, .wz-ctx-ico .ms {
  color: rgba(255, 255, 255, .9);
  font-size: 24px;
}

.wz-ctx-h {
  letter-spacing: -.02em;
  margin-bottom: .5rem;
  font-size: 1.25rem;
  font-weight: 800;
  line-height: 1.3;
}

.wz-ctx-p {
  color: rgba(255, 255, 255, .5);
  margin-bottom: 1.75rem;
  font-size: .8rem;
  line-height: 1.7;
}

.wz-ctx-list {
  flex-direction: column;
  gap: .6rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.wz-ctx-list li {
  color: rgba(255, 255, 255, .6);
  align-items: flex-start;
  gap: .55rem;
  font-size: .8rem;
  line-height: 1.5;
  display: flex;
}

.wz-ctx-list .material-symbols-outlined, .wz-ctx-list .ms {
  color: #68dba9;
  flex-shrink: 0;
  margin-top: 1px;
  font-size: 17px;
}

.wz-ctx-div {
  background: rgba(255, 255, 255, .08);
  height: 1px;
  margin: 1.75rem 0;
}

.wz-ctx-navlabel {
  text-transform: uppercase;
  letter-spacing: .1em;
  color: rgba(255, 255, 255, .3);
  margin-bottom: .9rem;
  font-size: .66rem;
  font-weight: 600;
}

.wz-steps {
  flex-direction: column;
  gap: .45rem;
  display: flex;
}

.wz-step-item {
  color: rgba(255, 255, 255, .3);
  align-items: center;
  gap: .7rem;
  font-size: .8rem;
  transition: color .2s;
  display: flex;
}

.wz-step-item.done {
  color: rgba(255, 255, 255, .6);
}

.wz-step-item.active {
  color: #fff;
  font-weight: 600;
}

.wz-step-num {
  font-variant-numeric: tabular-nums;
  border: 1.5px solid rgba(255, 255, 255, .2);
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 22px;
  height: 22px;
  font-size: 11px;
  font-weight: 700;
  transition: all .2s;
  display: flex;
}

.wz-step-item.done .wz-step-num {
  background: var(--green);
  border-color: var(--green);
  font-size: 0;
}

.wz-step-item.done .wz-step-num:after {
  content: "✓";
  color: #fff;
  font-size: 12px;
}

.wz-step-item.active .wz-step-num {
  background: var(--surface-container-lowest);
  color: var(--navy);
  border-color: #fff;
}

.wz-main {
  background: var(--surface);
  flex-direction: column;
  display: flex;
  overflow-y: auto;
}

.wz-body {
  flex: 1;
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
  padding: 1.75rem 1.25rem 7rem;
}

@media (width >= 960px) {
  .wz-body {
    padding: 2.75rem 2rem 8rem;
  }
}

.wz-step {
  display: none;
}

.wz-step.on {
  animation: rise .28s var(--eo) both;
  display: block;
}

.wz-badge {
  color: var(--navy);
  text-transform: uppercase;
  letter-spacing: .08em;
  background: rgba(19, 27, 46, .07);
  border-radius: 99px;
  align-items: center;
  gap: .35rem;
  margin-bottom: .9rem;
  padding: .25rem .65rem;
  font-size: .66rem;
  font-weight: 700;
  display: inline-flex;
}

.wz-badge .material-symbols-outlined, .wz-badge .ms {
  font-size: 14px;
}

.wz-title {
  letter-spacing: -.02em;
  color: var(--on-surface);
  margin-bottom: .4rem;
  font-size: 1.5rem;
  font-weight: 800;
}

@media (width >= 960px) {
  .wz-title {
    font-size: 1.65rem;
  }
}

.wz-sub {
  color: var(--on-surface-variant);
  margin-bottom: 1.75rem;
  font-size: .85rem;
  line-height: 1.6;
}

.wz-card {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .35);
  border-radius: 12px;
  margin-bottom: .9rem;
  padding: 1.25rem;
  box-shadow: 0 1px 2px rgba(25, 28, 30, .04);
}

.wz-card-t {
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--on-surface-variant);
  margin-bottom: 1.1rem;
  font-size: .66rem;
  font-weight: 700;
}

.wz-foot {
  background: var(--surface-container-lowest);
  z-index: 10;
  border-top: 1px solid rgba(198, 198, 205, .45);
  padding: .8rem 1.25rem;
  position: sticky;
  bottom: 0;
}

.wz-foot-in {
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  max-width: 640px;
  margin: 0 auto;
  display: flex;
}

.wz-done {
  background: linear-gradient(135deg,var(--navy) 0%,#1a2440 100%);
  color: #fff;
  text-align: center;
  border-radius: 12px;
  margin-bottom: .9rem;
  padding: 2rem 1.5rem;
  position: relative;
  overflow: hidden;
}

.wz-done:before {
  content: "";
  pointer-events: none;
  background: radial-gradient(at 50% 0, rgba(104, 219, 169, .18) 0%, rgba(0, 0, 0, 0) 65%);
  position: absolute;
  inset: 0;
}

.wz-done-ico {
  background: rgba(104, 219, 169, .12);
  border: 2px solid rgba(104, 219, 169, .4);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 64px;
  height: 64px;
  margin: 0 auto 1.1rem;
  display: flex;
  position: relative;
}

.wz-done-ico .material-symbols-outlined, .wz-done-ico .ms {
  color: #68dba9;
  font-size: 30px;
}

.wz-done-stats {
  z-index: 1;
  grid-template-columns: repeat(3, 1fr);
  gap: .6rem;
  margin-top: 1.4rem;
  display: grid;
  position: relative;
}

.wz-done-stat {
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 10px;
  padding: .8rem .5rem;
}

.na-row {
  border: 1.5px solid var(--outline-variant);
  cursor: pointer;
  background: var(--surface-container-lowest);
  border-radius: .6rem;
  align-items: center;
  gap: .8rem;
  margin-bottom: .6rem;
  padding: .8rem .9rem;
  transition: border-color .15s, background-color .15s;
  display: flex;
}

.na-row:last-child {
  margin-bottom: 0;
}

@media (hover: hover) {
  .na-row:hover {
    border-color: var(--primary);
    background: rgba(19, 27, 46, .02);
  }
}

.inv-chip {
  background: var(--surface-container-low);
  border: 1.5px solid var(--outline-variant);
  border-radius: .5rem;
  flex: 1;
  align-items: center;
  gap: .6rem;
  padding: .55rem .8rem;
  display: flex;
}

.inv-chip .material-symbols-outlined, .inv-chip .ms {
  color: var(--outline);
  font-size: 17px;
}

.inv-chip input {
  color: var(--on-surface);
  background: none;
  border: none;
  outline: none;
  flex: 1;
  min-width: 0;
  font-family: Inter, sans-serif;
  font-size: .85rem;
}

.av-up {
  background: var(--surface-container-low);
  border: 1.5px dashed var(--outline-variant);
  cursor: pointer;
  border-radius: .75rem;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  transition: all .15s;
  display: flex;
}

@media (hover: hover) {
  .av-up:hover {
    border-color: var(--primary);
    background: rgba(19, 27, 46, .03);
  }
}

.av-circle {
  background: var(--navy);
  color: #fff;
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 56px;
  height: 56px;
  font-size: 1.25rem;
  font-weight: 800;
  display: flex;
}

.wz-inv {
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 10px;
  align-items: center;
  gap: .75rem;
  margin-top: 1.5rem;
  padding: .9rem;
  display: flex;
}

.wz-inv-av {
  color: #fff;
  background: rgba(255, 255, 255, .14);
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 38px;
  height: 38px;
  font-size: .78rem;
  font-weight: 800;
  display: flex;
}

.wz-inv-name {
  font-size: .8rem;
  font-weight: 700;
}

.wz-inv-role {
  color: rgba(255, 255, 255, .5);
  margin-top: 1px;
  font-size: .68rem;
}

.wz-unit {
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 10px;
  margin-bottom: 1.5rem;
  overflow: hidden;
}

.wz-unit-img {
  background: linear-gradient(135deg, #1a2440, #33415e);
  justify-content: center;
  align-items: center;
  height: 96px;
  display: flex;
}

.wz-unit-img .material-symbols-outlined, .wz-unit-img .ms {
  color: rgba(255, 255, 255, .15);
  font-variation-settings: "FILL" 1;
  font-size: 44px;
}

.wz-unit-body {
  padding: .9rem;
}

.wz-unit-name {
  margin-bottom: .55rem;
  font-size: .85rem;
  font-weight: 700;
}

.wz-unit-badge {
  color: #68dba9;
  background: rgba(104, 219, 169, .12);
  border: 1px solid rgba(104, 219, 169, .3);
  border-radius: 99px;
  align-items: center;
  gap: .3rem;
  padding: .2rem .55rem;
  font-size: .62rem;
  font-weight: 700;
  display: inline-flex;
}

.wz-unit-badge .material-symbols-outlined, .wz-unit-badge .ms {
  font-size: 12px;
}

.wz-consent {
  cursor: pointer;
  color: var(--on-surface);
  align-items: flex-start;
  gap: .75rem;
  margin: .75rem 0 0;
  font-size: .85rem;
  line-height: 1.5;
  display: flex;
}

.wz-consent input {
  flex-shrink: 0;
  margin-top: .2rem;
}

.wz-review {
  background: var(--surface-container-low);
  border-radius: .75rem;
  flex-direction: column;
  gap: .4rem;
  padding: .85rem 1rem;
  display: flex;
}

.wz-review-row {
  justify-content: space-between;
  gap: 1rem;
  font-size: .85rem;
  display: flex;
}

.wz-review-row span {
  color: var(--on-surface-variant);
}

.upzone {
  border: 2px dashed var(--outline-variant);
  text-align: center;
  cursor: pointer;
  border-radius: .6rem;
  padding: 1rem;
  transition: border-color .15s, background-color .15s;
}

@media (hover: hover) {
  .upzone:hover {
    border-color: var(--primary);
  }
}

.upzone.done {
  border-style: solid;
  border-color: var(--green);
  background: rgba(6, 150, 105, .04);
}

.upzone .material-symbols-outlined {
  color: #c6c6cd;
  margin-bottom: .25rem;
  font-size: 24px;
  display: block;
}

.upzone.done .material-symbols-outlined {
  color: var(--green);
  font-variation-settings: "FILL" 1;
}

.up-label {
  font-size: .8rem;
  font-weight: 600;
}

.up-row {
  background: var(--surface-container-low);
  border: 1.5px dashed var(--outline-variant);
  cursor: pointer;
  border-radius: .6rem;
  align-items: center;
  gap: .9rem;
  margin-bottom: .6rem;
  padding: .9rem 1rem;
  transition: border-color .15s, background-color .15s;
  display: flex;
}

.up-row:last-child {
  margin-bottom: 0;
}

.up-row > span.material-symbols-outlined {
  color: var(--outline);
  font-size: 24px;
}

.up-row.done {
  border-style: solid;
  border-color: var(--green);
  background: rgba(104, 219, 169, .08);
}

.up-row.done > span.material-symbols-outlined {
  color: var(--green);
}

.up-lbl {
  font-size: .85rem;
  font-weight: 600;
}

.up-hint {
  color: var(--outline);
  margin-top: 1px;
  font-size: .72rem;
}

.up-ck {
  color: var(--green);
  flex-shrink: 0;
  margin-left: auto;
  display: none;
}

.up-row.done .up-ck {
  display: block;
}

.pub-nav {
  z-index: 100;
  -webkit-backdrop-filter: blur(14px);
  color: #fff;
  background: rgba(13, 18, 32, .85);
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  justify-content: space-between;
  align-items: center;
  height: 56px;
  padding: 0 1.25rem;
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
}

@media (width >= 768px) {
  .pub-nav {
    padding: 0 2rem;
  }
}

.pub-nav-links {
  align-items: center;
  gap: 1.6rem;
  display: none;
}

.pub-nav-links a {
  color: rgba(255, 255, 255, .65);
  font-size: .82rem;
  font-weight: 600;
  transition: color .15s;
}

.pub-nav-links a:hover, .pub-nav-links a[aria-current="page"] {
  color: #fff;
}

@media (width >= 860px) {
  .pub-nav-links {
    display: flex;
  }
}

.pub-nav-mark {
  color: #fff;
  letter-spacing: -.03em;
  align-items: center;
  gap: .6rem;
  font-weight: 800;
  text-decoration: none;
  display: flex;
}

.pub-nav-mark-icon {
  background: rgba(255, 255, 255, .1);
  border-radius: .45rem;
  justify-content: center;
  align-items: center;
  width: 1.75rem;
  height: 1.75rem;
  font-size: .75rem;
  display: flex;
}

.pub-nav-wordmark {
  font-size: 1.05rem;
}

.pub-nav-actions {
  align-items: center;
  gap: .5rem;
  display: flex;
}

.pub-nav-cta {
  color: rgba(255, 255, 255, .85);
  background: none;
  border-color: rgba(255, 255, 255, .25);
}

.pub-nav-toggle {
  color: #fff;
  background: none;
  border: 1px solid rgba(255, 255, 255, .25);
  border-radius: .5rem;
  justify-content: center;
  align-items: center;
  min-height: 2.25rem;
  padding: .35rem .7rem;
  font-size: .78rem;
  font-weight: 700;
  display: inline-flex;
}

@media (width >= 860px) {
  .pub-nav-toggle {
    display: none;
  }
}

.pub-nav-drawer {
  background: rgba(13, 18, 32, .96);
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  flex-direction: column;
  gap: .25rem;
  padding: .75rem 1.25rem 1rem;
  display: none;
  position: absolute;
  top: 56px;
  left: 0;
  right: 0;
}

.pub-nav-drawer a {
  color: rgba(255, 255, 255, .8);
  padding: .55rem 0;
  font-size: .95rem;
  font-weight: 600;
}

.pub-nav-drawer.is-open {
  display: flex;
}

@media (width >= 860px) {
  .pub-nav-drawer, .pub-nav-drawer.is-open {
    display: none;
  }
}

.pub-catalog-page {
  min-height: 100vh;
  padding-top: 56px;
}

.pub-catalog-page .listings-filter-bar {
  top: 56px;
}

.pub-catalog-footer {
  text-align: center;
  color: var(--on-surface-variant);
  padding: 1.5rem 1.25rem 2.5rem;
  font-size: .78rem;
}

.pub-g27-chip {
  color: #069669;
  background: rgba(104, 219, 169, .14);
  border-radius: 99px;
  align-items: center;
  margin-top: .35rem;
  padding: .15rem .5rem;
  font-size: .72rem;
  font-weight: 700;
  display: inline-flex;
}

.pub-shop-hero {
  text-align: left;
}

.pub-shop-identity {
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  margin: 1rem 0 .75rem;
  display: flex;
}

.pub-shop-mark {
  color: #fff;
  background: rgba(255, 255, 255, .1);
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 1rem;
  justify-content: center;
  align-items: center;
  width: 3.5rem;
  height: 3.5rem;
  font-size: 1.1rem;
  font-weight: 800;
  display: flex;
}

.pub-shop-h2 {
  margin: 0 0 .5rem;
  font-size: .85rem;
  font-weight: 700;
}

.pub-shop-grid {
  grid-template-columns: 1fr;
  gap: 1.25rem;
  max-width: 72rem;
  margin: 0 auto;
  padding: 1.25rem 1.25rem 2.5rem;
  display: grid;
}

@media (width >= 1024px) {
  .pub-shop-grid {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    align-items: start;
  }

  .pub-shop-aside {
    position: sticky;
    top: 4.5rem;
  }
}

.pub-hero {
  color: #fff;
  background: linear-gradient(160deg,#0d1420 0%,var(--navy) 55%,#1c2c4e 100%);
  position: relative;
  overflow: hidden;
}

.pub-hero:before {
  content: "";
  pointer-events: none;
  background: repeating-linear-gradient(0deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 60px, rgba(255, 255, 255, .02) 60px 61px), repeating-linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 60px, rgba(255, 255, 255, .02) 60px 61px);
  position: absolute;
  inset: 0;
}

.pub-hero:after {
  content: "";
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(circle, rgba(104, 219, 169, .13) 0%, rgba(0, 0, 0, 0) 70%);
  border-radius: 50%;
  width: 700px;
  height: 700px;
  position: absolute;
  bottom: -220px;
  right: -160px;
}

.pub-hero-in {
  z-index: 1;
  text-align: center;
  max-width: 880px;
  margin: 0 auto;
  padding: 7.5rem 1.25rem 4.5rem;
  position: relative;
}

@media (width >= 768px) {
  .pub-hero-in {
    padding: 9rem 2rem 5.5rem;
  }
}

.pub-eyebrow {
  text-transform: uppercase;
  letter-spacing: .1em;
  color: rgba(255, 255, 255, .78);
  background: rgba(255, 255, 255, .08);
  border: 1.5px solid rgba(255, 255, 255, .15);
  border-radius: 99px;
  align-items: center;
  gap: .5rem;
  margin-bottom: 1.75rem;
  padding: .3rem .85rem;
  font-size: .68rem;
  font-weight: 700;
  display: inline-flex;
}

.pub-eyebrow .dot {
  background: var(--btc);
  border-radius: 99px;
  flex-shrink: 0;
  width: .5rem;
  height: .5rem;
  box-shadow: 0 0 0 3px rgba(247, 147, 26, .22);
}

.pub-h1 {
  letter-spacing: -.04em;
  color: #fff;
  margin: 0 0 1.25rem;
  font-size: clamp(2.4rem, 6vw, 4.4rem);
  font-weight: 900;
  line-height: 1.05;
}

.pub-h1 .hl-o {
  color: #f7931a;
}

.pub-h1 .hl-g {
  color: #68dba9;
}

.pub-sub {
  color: rgba(255, 255, 255, .7);
  max-width: 640px;
  margin: 0 auto 2.25rem;
  font-size: clamp(1rem, 2vw, 1.15rem);
  line-height: 1.75;
}

.pub-proof {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 1.1rem;
  margin-top: 2.5rem;
  display: flex;
}

.pub-proof-item {
  color: rgba(255, 255, 255, .6);
  align-items: center;
  gap: .45rem;
  font-size: .75rem;
  font-weight: 500;
  display: flex;
}

.pub-proof-item .material-symbols-outlined, .pub-proof-item .ms {
  color: #68dba9;
  font-size: 15px;
}

.pub-proof-sep {
  background: rgba(255, 255, 255, .15);
  width: 1px;
  height: .9rem;
}

.pub-section {
  padding: 4rem 1.25rem;
}

@media (width >= 768px) {
  .pub-section {
    padding: 5.5rem 2rem;
  }
}

.pub-inner {
  max-width: 1140px;
  margin: 0 auto;
}

.pub-kicker {
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--btc-ink);
  margin-bottom: .8rem;
  font-size: .62rem;
  font-weight: 700;
  display: block;
}

.pub-kicker.g {
  color: var(--green);
}

.pub-kicker.n {
  color: var(--navy);
}

.pub-kicker.w {
  color: rgba(255, 255, 255, .5);
}

.pub-h2 {
  letter-spacing: -.03em;
  color: var(--on-surface);
  margin: 0 0 .8rem;
  font-size: clamp(1.6rem, 3.6vw, 2.4rem);
  font-weight: 800;
  line-height: 1.15;
}

.pub-h2.w {
  color: #fff;
}

.pub-lead {
  color: var(--on-surface-variant);
  max-width: 560px;
  margin: 0;
  font-size: 1rem;
  line-height: 1.75;
}

.pub-lead.w {
  color: rgba(255, 255, 255, .62);
}

.pub-band-dark {
  background: linear-gradient(135deg,#0d1420 0%,var(--navy) 100%);
  color: #fff;
}

.pub-band-soft {
  background: var(--surface-container-low);
}

.pub-hr {
  border: none;
  border-top: 1px solid rgba(198, 198, 205, .35);
  margin: 0;
}

.pub-stats {
  grid-template-columns: repeat(2, 1fr);
  gap: 1.75rem;
  max-width: 1000px;
  margin: 0 auto;
  display: grid;
}

@media (width >= 768px) {
  .pub-stats {
    grid-template-columns: repeat(4, 1fr);
  }
}

.pub-stat-num {
  letter-spacing: -.04em;
  color: var(--navy);
  font-variant-numeric: tabular-nums;
  font-size: 2.4rem;
  font-weight: 900;
  line-height: 1;
}

.pub-stat-num > em {
  color: #f7931a;
  font-style: normal;
}

.pub-stat-label {
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--outline);
  margin-top: .5rem;
  font-size: .64rem;
  font-weight: 600;
}

.pub-card {
  background: var(--surface-container-lowest);
  transition: box-shadow .2s var(--eo), transform .2s var(--eo), border-color .2s;
  border: 1px solid rgba(198, 198, 205, .4);
  border-top: 3px solid #e0e3e5;
  border-radius: 14px;
  padding: 1.5rem;
  box-shadow: 0 1px 2px rgba(25, 28, 30, .04);
}

@media (hover: hover) {
  .pub-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 32px rgba(25, 28, 30, .09);
  }
}

.pub-card.acc-g {
  border-top-color: var(--green);
}

.pub-card.acc-o {
  border-top-color: #f7931a;
}

.pub-card.acc-n {
  border-top-color: var(--navy);
}

.pub-card.acc-r {
  border-top-color: #ba1a1a;
}

.pub-card-ico {
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  width: 42px;
  height: 42px;
  margin-bottom: 1rem;
  display: flex;
}

.pub-cells {
  background: rgba(198, 198, 205, .45);
  border: 1px solid rgba(198, 198, 205, .45);
  border-radius: 14px;
  gap: 1px;
  margin-top: 2.25rem;
  display: grid;
  overflow: hidden;
}

@media (width >= 640px) {
  .pub-cells {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (width >= 1024px) {
  .pub-cells {
    grid-template-columns: repeat(3, 1fr);
  }
}

.pub-cell {
  background: var(--surface-container-lowest);
  padding: 1.75rem;
  transition: background .18s;
}

@media (hover: hover) {
  .pub-cell:hover {
    background: var(--surface);
  }
}

.pub-card-d {
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 12px;
  padding: 1.4rem;
  transition: background .18s;
}

@media (hover: hover) {
  .pub-card-d:hover {
    background: rgba(255, 255, 255, .08);
  }
}

.pub-card-d h3 {
  color: #fff;
}

.pub-grid {
  grid-template-columns: 1fr;
  gap: 1rem;
  margin-top: 2.25rem;
  display: grid;
}

@media (width >= 640px) {
  .pub-grid.g2 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (width >= 768px) {
  .pub-grid.g3 {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (width >= 900px) {
  .pub-grid.g4 {
    grid-template-columns: repeat(4, 1fr);
  }
}

.wl-input {
  color: #fff;
  backdrop-filter: blur(8px);
  background: rgba(255, 255, 255, .1);
  border: 1.5px solid rgba(255, 255, 255, .2);
  border-radius: .625rem;
  outline: none;
  flex: 1;
  min-width: 220px;
  padding: .8rem 1.1rem;
  font-family: inherit;
  font-size: .95rem;
  transition: border-color .15s, box-shadow .15s;
}

.wl-input::placeholder {
  color: rgba(255, 255, 255, .45);
}

.wl-input:focus {
  border-color: rgba(255, 255, 255, .55);
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .08);
}

.wl-pill {
  color: rgba(255, 255, 255, .72);
  cursor: pointer;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .15);
  border-radius: 99px;
  padding: .42rem .95rem;
  font-family: inherit;
  font-size: .8rem;
  font-weight: 600;
  transition: all .15s;
}

@media (hover: hover) {
  .wl-pill:hover {
    color: #fff;
    background: rgba(255, 255, 255, .15);
  }
}

.wl-pill.sel {
  background: var(--btc);
  color: var(--navy);
  border-color: #f7931a;
}

.wl-pill.sel-g {
  background: var(--green);
  border-color: var(--green);
  color: #fff;
}

.pub-cta {
  background: linear-gradient(135deg,#0d1420 0%,var(--navy) 100%);
  color: #fff;
  text-align: center;
}

.pub-footer {
  color: rgba(255, 255, 255, .42);
  background: #0a0e18;
  border-top: 1px solid rgba(255, 255, 255, .08);
  padding: 3rem 1.25rem 2rem;
}

@media (width >= 768px) {
  .pub-footer {
    padding: 3rem 2rem 2rem;
  }
}

.pub-footer h4 {
  text-transform: uppercase;
  letter-spacing: .1em;
  color: rgba(255, 255, 255, .52);
  margin: 0 0 .85rem;
  font-size: .64rem;
  font-weight: 700;
}

.pub-footer a {
  color: rgba(255, 255, 255, .42);
  margin-bottom: .5rem;
  font-size: .8rem;
  transition: color .15s;
  display: block;
}

.pub-footer a:hover {
  color: rgba(255, 255, 255, .85);
}

.pub-foot {
  color: rgba(255, 255, 255, .42);
  background: #0a0e18;
  border-top: 1px solid rgba(255, 255, 255, .08);
  padding: 3rem 1.25rem 2rem;
}

@media (width >= 768px) {
  .pub-foot {
    padding: 3.5rem 2rem 2rem;
  }
}

.pub-foot-in {
  max-width: 1140px;
  margin: 0 auto;
}

.pub-foot-grid {
  border-bottom: 1px solid rgba(255, 255, 255, .07);
  grid-template-columns: 1fr;
  gap: 2rem;
  padding-bottom: 2.25rem;
  display: grid;
}

@media (width >= 768px) {
  .pub-foot-grid {
    grid-template-columns: 1.5fr 1fr 1fr 1fr 1fr;
  }
}

.pub-foot-brand p {
  color: rgba(255, 255, 255, .42);
  max-width: 19rem;
  margin-top: .9rem;
  font-size: .8rem;
  line-height: 1.7;
}

.pub-foot-col > p {
  text-transform: uppercase;
  letter-spacing: .1em;
  color: rgba(255, 255, 255, .52);
  margin: 0 0 .85rem;
  font-size: .64rem;
  font-weight: 700;
}

.pub-foot-col a {
  color: rgba(255, 255, 255, .42);
  margin-bottom: .5rem;
  font-size: .8rem;
  transition: color .15s;
  display: block;
}

.pub-foot-col a:hover {
  color: rgba(255, 255, 255, .85);
}

.pub-foot-base {
  color: rgba(255, 255, 255, .35);
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .75rem 1.5rem;
  padding-top: 1.5rem;
  font-size: .72rem;
  display: flex;
}

@media (hover: hover) {
  .pub-price:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 32px rgba(25, 28, 30, .09);
  }
}

.pub-price {
  background: var(--surface-container-lowest);
  transition: box-shadow .2s var(--eo),transform .2s var(--eo),border-color .2s;
  border: 1px solid rgba(198, 198, 205, .4);
  border-radius: 14px;
  flex-direction: column;
  padding: 1.75rem;
  display: flex;
}

@media (hover: hover) {
  .pub-price:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 32px rgba(25, 28, 30, .09);
  }
}

.pub-price.feat {
  border: 1.5px solid var(--navy);
  box-shadow: 0 12px 36px rgba(19, 27, 46, .12);
}

.sheet-ov {
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s var(--eo);
  z-index: 60;
  background: rgba(25, 28, 30, .45);
  position: fixed;
  inset: 0;
}

.sheet-ov.open {
  opacity: 1;
  pointer-events: auto;
}

.sheet {
  background: var(--surface-container-lowest);
  z-index: 61;
  width: min(480px, 100vw);
  transition: transform .28s var(--eo);
  border-left: 1px solid rgba(198, 198, 205, .35);
  flex-direction: column;
  display: flex;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  transform: translateX(105%);
  box-shadow: -12px 0 40px rgba(25, 28, 30, .18);
}

.sheet.open {
  transform: translateX(0);
}

.sheet.wide {
  width: min(520px, 100vw);
}

@media (width >= 768px) {
  .sheet.wide {
    width: min(32rem, 100vw);
  }
}

@media (width >= 1024px) {
  .sheet.wide {
    width: min(40rem, 100vw);
  }
}

.msg-row {
  gap: 8px;
  margin-bottom: 14px;
  display: flex;
}

.msg-row.own {
  flex-direction: row-reverse;
}

.msg-bubble {
  border-radius: 14px;
  max-width: 78%;
  padding: 10px 14px;
  font-size: .82rem;
  line-height: 1.45;
}

.msg-bubble.other {
  background: var(--surface-container-low);
  color: var(--on-surface);
  border-bottom-left-radius: 4px;
}

.msg-bubble.own {
  background: var(--navy);
  color: #fff;
  border-bottom-right-radius: 4px;
}

@media (width >= 768px) {
  .msg-bubble {
    max-width: 70%;
  }
}

@media (width <= 767px) {
  .sheet {
    border-left: none;
    border-radius: 16px 16px 0 0;
    height: 88vh;
    top: auto;
    transform: translateY(105%);
    box-shadow: 0 -12px 40px rgba(25, 28, 30, .18);
  }

  .sheet.open {
    transform: translateY(0);
  }
}

.modal {
  z-index: 61;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s var(--eo);
  justify-content: center;
  align-items: center;
  padding: 16px;
  display: flex;
  position: fixed;
  inset: 0;
}

.modal.open {
  opacity: 1;
  pointer-events: auto;
}

.modal-box {
  background: var(--surface-container-lowest);
  width: 100%;
  max-width: 520px;
  max-height: 90vh;
  animation: pop .22s var(--eo);
  border: 1px solid rgba(198, 198, 205, .35);
  border-radius: 16px;
  overflow-y: auto;
  box-shadow: 0 24px 64px rgba(25, 28, 30, .25);
}

@media (width <= 767px) {
  .modal {
    align-items: flex-end;
    padding: 0;
  }

  .modal-box {
    border-radius: 16px 16px 0 0;
    max-width: 100%;
    max-height: 92vh;
  }
}

.fchip {
  background: var(--surface-container-lowest);
  color: var(--on-surface-variant);
  cursor: pointer;
  border: 1.5px solid rgba(198, 198, 205, .6);
  border-radius: 99px;
  flex-shrink: 0;
  align-items: center;
  gap: .35rem;
  padding: .42rem .85rem;
  font-family: inherit;
  font-size: .72rem;
  font-weight: 600;
  transition: border-color .15s, color .15s, background .15s;
  display: inline-flex;
}

@media (hover: hover) {
  .fchip:hover {
    border-color: var(--primary);
    color: var(--on-surface);
  }
}

.fchip.on {
  background: var(--navy);
  border-color: var(--primary);
  color: #fff;
}

.fchip .material-symbols-outlined {
  font-size: 14px;
}

.lst-card {
  background: var(--surface-container-lowest);
  transition: transform .18s var(--eo),box-shadow .18s;
  border: 1px solid rgba(198, 198, 205, .35);
  border-radius: 14px;
  flex-direction: column;
  display: flex;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(25, 28, 30, .04);
}

@media (hover: hover) {
  .lst-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(25, 28, 30, .1);
  }
}

.tl-dot {
  background: var(--surface-container-highest);
  width: .7rem;
  height: .7rem;
  box-shadow: 0 0 0 2px var(--surface-container-lowest);
  border-radius: 50%;
  position: absolute;
  top: .3rem;
  left: -1.35rem;
}

.stitch-only {
  color: #8a4b00;
  background: rgba(225, 137, 55, .08);
  border: 1px dashed rgba(178, 106, 0, .55);
  border-radius: .65rem;
  margin-top: 1rem;
  padding: .65rem .85rem;
  font-size: .65rem;
  line-height: 1.45;
}

.stitch-only:before {
  content: "STITCH ONLY — do not implement";
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #8a4b00;
  margin-bottom: .35rem;
  font-weight: 800;
  display: block;
}

.stitch-only a {
  color: #8a4b00;
  font-weight: 700;
  text-decoration: underline;
}

.seg-btn {
  min-width: 34px;
  height: 30px;
  color: var(--on-surface-variant);
  background: var(--surface-container-lowest);
  cursor: pointer;
  transition: all .15s var(--eo);
  border: 1px solid rgba(198, 198, 205, .5);
  border-radius: 7px;
  padding: 0 6px;
  font-size: .72rem;
  font-weight: 700;
}

@media (hover: hover) {
  .seg-btn:hover {
    border-color: var(--primary);
    color: var(--navy);
  }
}

.seg-btn.on {
  background: var(--navy);
  color: #fff;
  border-color: var(--primary);
}

.seg .seg-btn {
  background: none;
  border-color: rgba(0, 0, 0, 0);
}

.seg .seg-btn.on {
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  box-shadow: 0 1px 2px rgba(25, 28, 30, .1);
}

.kpi-grid {
  grid-template-columns: repeat(2, 1fr);
  gap: .75rem;
  margin-bottom: 1.25rem;
  display: grid;
}

@media (width >= 1024px) {
  .kpi-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

a.card.kpi {
  color: inherit;
  text-decoration: none;
}

.proj-section {
  background: var(--surface-container-lowest);
  border: 1px solid color-mix(in srgb, var(--outline-variant) 35%, transparent);
  border-radius: 12px;
  margin-bottom: .9rem;
  padding: 1.25rem;
  box-shadow: 0 1px 2px rgba(25, 28, 30, .04);
}

.proj-section__head {
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  margin-bottom: .75rem;
  display: flex;
}

.proj-section__title {
  color: var(--on-surface);
  margin: 0;
  font-size: .875rem;
  font-weight: 700;
}

.proj-section__hint {
  color: var(--on-surface-variant);
  font-size: .75rem;
  line-height: 1.5;
}

.tenant-rent-hero {
  color: #fff;
  background: linear-gradient(135deg, var(--navy) 0%, #0f172a 100%);
  border-radius: 12px;
  padding: 1.25rem 1.5rem;
  position: relative;
  overflow: hidden;
}

@media (width >= 768px) {
  .tenant-rent-hero {
    padding: 1.5rem;
  }
}

.tenant-rent-hero__amt {
  letter-spacing: -.02em;
  font-size: 2.25rem;
  font-weight: 800;
  line-height: 1.1;
}

@media (width >= 768px) {
  .tenant-rent-hero__amt {
    font-size: 3rem;
  }
}

.folio-empty {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: .35rem;
  padding: 2rem 1rem;
  display: flex;
}

.folio-empty__icon {
  color: var(--outline);
  font-size: 2rem;
}

.folio-empty__heading {
  color: var(--on-surface);
  margin: 0;
  font-size: .95rem;
  font-weight: 700;
}

.folio-empty__sub {
  color: var(--on-surface-variant);
  margin: 0;
  font-size: .8rem;
}

.mq-feed-cards > li {
  display: contents;
}

.tbl-md {
  display: none;
}

@media (width >= 768px) {
  .tbl-md {
    display: block;
  }
}

.feed-sm {
  flex-direction: column;
  display: flex;
}

@media (width >= 768px) {
  .feed-sm {
    display: none !important;
  }
}

.dropzone {
  border: 2px dashed var(--outline-variant);
  text-align: center;
  cursor: pointer;
  width: 100%;
  color: var(--on-surface);
  background: none;
  border-radius: 1rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .75rem;
  margin-bottom: 1.25rem;
  padding: 1.5rem;
  font-family: inherit;
  display: flex;
}

@media (width >= 640px) {
  .dropzone {
    text-align: left;
    flex-direction: row;
    padding: 2rem;
  }
}

.dropzone:hover {
  border-color: var(--primary);
  background: var(--surface-container-low);
}

.doc-thumb {
  background: var(--surface-container-high);
  width: 44px;
  height: 44px;
  color: var(--on-surface-variant);
  border-radius: .65rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: flex;
}

.doc-thumb .material-symbols-outlined {
  font-size: 22px;
}

@media (width >= 640px) {
  .doc-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (width >= 1024px) {
  .doc-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (width >= 1280px) {
  .doc-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.filter-bar {
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  margin-bottom: 1rem;
  display: flex;
}

.filter-bar__search {
  align-items: center;
  gap: .35rem;
  margin-left: auto;
  display: flex;
}

.folio-search {
  color: var(--on-surface);
  background: var(--surface-container-low);
  border: 1px solid color-mix(in srgb, var(--outline-variant) 30%, transparent);
  border-radius: .5rem;
  width: 13rem;
  padding: .375rem .625rem;
  font-family: inherit;
  font-size: .75rem;
}

.sign-band {
  background: color-mix(in srgb, var(--error-container) 45%, transparent);
  border: 1px solid color-mix(in srgb, var(--error) 28%, transparent);
  border-radius: 12px;
  align-items: center;
  gap: .75rem;
  padding: .9rem 1rem;
  display: flex;
}

@media (width >= 1024px) {
  .tdocs-hero-grid {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  }
}

@media (width >= 1024px) {
  .tdocs-groups {
    grid-template-columns: 1fr 1fr;
  }
}

.tdocs-kicker {
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--on-surface-variant);
  margin: 0 0 .5rem;
  font-size: 10px;
  font-weight: 700;
}

.pay-due-warn {
  background: color-mix(in srgb, var(--btc) 22%, transparent);
  border-top: 1px solid color-mix(in srgb, var(--btc) 40%, transparent);
  align-items: center;
  gap: .6rem;
  padding: .75rem 1.25rem;
  display: flex;
}

.qr-box {
  text-align: center;
  background: var(--surface-container-low);
  border: 2px dashed var(--outline-variant);
  border-radius: .75rem;
  justify-content: center;
  align-items: center;
  width: 150px;
  height: 150px;
  margin: 0 auto;
  display: flex;
}

.job-thread {
  background: var(--surface-container-lowest);
  border: 1px solid color-mix(in srgb, var(--outline-variant) 35%, transparent);
  border-radius: 12px;
  padding: 1.25rem;
}

.job-thread__sub, .job-thread__hint, .job-thread__empty, .job-thread__err, .job-thread__meta {
  color: var(--on-surface-variant);
  font-size: .75rem;
}

.job-thread__compose {
  flex-direction: column;
  gap: .5rem;
  margin-top: 1rem;
  display: flex;
}

@media (prefers-reduced-motion: reduce) {
  *, :before, :after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

*, :before, :after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgba(59, 130, 246, .5);
  --tw-ring-offset-shadow: 0 0 rgba(0, 0, 0, 0);
  --tw-ring-shadow: 0 0 rgba(0, 0, 0, 0);
  --tw-shadow: 0 0 rgba(0, 0, 0, 0);
  --tw-shadow-colored: 0 0 rgba(0, 0, 0, 0);
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgba(59, 130, 246, .5);
  --tw-ring-offset-shadow: 0 0 rgba(0, 0, 0, 0);
  --tw-ring-shadow: 0 0 rgba(0, 0, 0, 0);
  --tw-shadow: 0 0 rgba(0, 0, 0, 0);
  --tw-shadow-colored: 0 0 rgba(0, 0, 0, 0);
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

*, :before, :after {
  box-sizing: border-box;
  border: 0 solid #e5e7eb;
}

:before, :after {
  --tw-content: "";
}

html {
  -webkit-text-size-adjust: 100%;
  tab-size: 4;
  font-feature-settings: normal;
  font-variation-settings: normal;
  -webkit-tap-highlight-color: transparent;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
  line-height: 1.5;
}

:host {
  -webkit-text-size-adjust: 100%;
  tab-size: 4;
  font-feature-settings: normal;
  font-variation-settings: normal;
  -webkit-tap-highlight-color: transparent;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
  line-height: 1.5;
}

body {
  line-height: inherit;
  margin: 0;
}

hr {
  height: 0;
  color: inherit;
  border-top-width: 1px;
}

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
}

h1, h2, h3, h4, h5, h6 {
  font-size: inherit;
  font-weight: inherit;
}

a {
  color: inherit;
  -webkit-text-decoration: inherit;
  text-decoration: inherit;
}

b, strong {
  font-weight: bolder;
}

code, kbd, samp, pre {
  font-feature-settings: normal;
  font-variation-settings: normal;
  font-family: JetBrains Mono, ui-monospace, monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub, sup {
  vertical-align: baseline;
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sub {
  bottom: -.25em;
}

sup {
  top: -.5em;
}

table {
  text-indent: 0;
  border-color: inherit;
  border-collapse: collapse;
}

button, input, optgroup, select, textarea {
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-family: inherit;
  font-size: 100%;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  color: inherit;
  margin: 0;
  padding: 0;
}

button, select {
  text-transform: none;
}

button {
  -webkit-appearance: button;
  background-color: rgba(0, 0, 0, 0);
  background-image: none;
}

input:where([type="button"]) {
  -webkit-appearance: button;
  background-color: rgba(0, 0, 0, 0);
  background-image: none;
}

input:where([type="reset"]) {
  -webkit-appearance: button;
  background-color: rgba(0, 0, 0, 0);
  background-image: none;
}

input:where([type="submit"]) {
  -webkit-appearance: button;
  background-color: rgba(0, 0, 0, 0);
  background-image: none;
}

:-moz-focusring {
  outline: auto;
}

:-moz-ui-invalid {
  box-shadow: none;
}

progress {
  vertical-align: baseline;
}

::-webkit-inner-spin-button {
  height: auto;
}

::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

summary {
  display: list-item;
}

blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol, ul, menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

dialog {
  padding: 0;
}

textarea {
  resize: vertical;
}

input::-moz-placeholder {
  opacity: 1;
  color: #9ca3af;
}

textarea::-moz-placeholder {
  opacity: 1;
  color: #9ca3af;
}

input::placeholder {
  opacity: 1;
  color: #9ca3af;
}

textarea::placeholder {
  opacity: 1;
  color: #9ca3af;
}

button, [role="button"] {
  cursor: pointer;
}

:disabled {
  cursor: default;
}

img, svg, video, canvas, audio, iframe, embed, object {
  vertical-align: middle;
  display: block;
}

img, video {
  max-width: 100%;
  height: auto;
}

[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}

.container {
  width: 100%;
}

@media (width >= 640px) {
  .container {
    max-width: 640px;
  }
}

@media (width >= 768px) {
  .container {
    max-width: 768px;
  }
}

@media (width >= 1024px) {
  .container {
    max-width: 1024px;
  }
}

@media (width >= 1280px) {
  .container {
    max-width: 1280px;
  }
}

@media (width >= 1536px) {
  .container {
    max-width: 1536px;
  }
}

.sr-only {
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  position: absolute;
  overflow: hidden;
}

.visible {
  visibility: visible;
}

.invisible {
  visibility: hidden;
}

.collapse {
  visibility: collapse;
}

.static {
  position: static;
}

.fixed {
  position: fixed;
}

.absolute {
  position: absolute;
}

.relative {
  position: relative;
}

.sticky {
  position: sticky;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.mb-0 {
  margin-bottom: 0;
}

.mb-1 {
  margin-bottom: .25rem;
}

.mb-2 {
  margin-bottom: .5rem;
}

.mb-3 {
  margin-bottom: .75rem;
}

.mb-4 {
  margin-bottom: 1rem;
}

.ml-1 {
  margin-left: .25rem;
}

.mr-1 {
  margin-right: .25rem;
}

.mr-2 {
  margin-right: .5rem;
}

.mt-1 {
  margin-top: .25rem;
}

.mt-2 {
  margin-top: .5rem;
}

.mt-3 {
  margin-top: .75rem;
}

.mt-4 {
  margin-top: 1rem;
}

.\!block {
  display: block !important;
}

.block {
  display: block;
}

.inline-block {
  display: inline-block;
}

.inline {
  display: inline;
}

.flex {
  display: flex;
}

.inline-flex {
  display: inline-flex;
}

.table {
  display: table;
}

.grid {
  display: grid;
}

.hidden {
  display: none;
}

.h-12 {
  height: 3rem;
}

.h-3 {
  height: .75rem;
}

.h-3\.5 {
  height: .875rem;
}

.h-8 {
  height: 2rem;
}

.w-12 {
  width: 3rem;
}

.w-3 {
  width: .75rem;
}

.w-3\.5 {
  width: .875rem;
}

.w-8 {
  width: 2rem;
}

.w-full {
  width: 100%;
}

.min-w-0 {
  min-width: 0;
}

.flex-1 {
  flex: 1;
}

.flex-shrink-0 {
  flex-shrink: 0;
}

.grow {
  flex-grow: 1;
}

.resize {
  resize: both;
}

.flex-wrap {
  flex-wrap: wrap;
}

.items-center {
  align-items: center;
}

.justify-end {
  justify-content: flex-end;
}

.justify-center {
  justify-content: center;
}

.justify-between {
  justify-content: space-between;
}

.gap-1 {
  gap: .25rem;
}

.gap-2 {
  gap: .5rem;
}

.gap-2\.5 {
  gap: .625rem;
}

.gap-3 {
  gap: .75rem;
}

.gap-4 {
  gap: 1rem;
}

.space-y-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(.5rem * var(--tw-space-y-reverse));
}

.space-y-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(.75rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(.75rem * var(--tw-space-y-reverse));
}

.space-y-4 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
}

.overflow-hidden {
  overflow: hidden;
}

.overflow-x-auto {
  overflow-x: auto;
}

.truncate {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.rounded {
  border-radius: .125rem;
}

.rounded-2xl {
  border-radius: 1rem;
}

.rounded-lg {
  border-radius: .5rem;
}

.rounded-xl {
  border-radius: .75rem;
}

.border {
  border-width: 1px;
}

.border-b {
  border-bottom-width: 1px;
}

.border-t {
  border-top-width: 1px;
}

.border-\[var\(--folio-border\)\] {
  border-color: var(--folio-border);
}

.border-amber-200 {
  --tw-border-opacity: 1;
  border-color: rgb(253 230 138 / var(--tw-border-opacity, 1));
}

.border-gray-100 {
  --tw-border-opacity: 1;
  border-color: rgb(243 244 246 / var(--tw-border-opacity, 1));
}

.border-gray-200 {
  --tw-border-opacity: 1;
  border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
}

.bg-amber-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(255 251 235 / var(--tw-bg-opacity, 1));
}

.bg-primary {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}

.p-2 {
  padding: .5rem;
}

.p-3 {
  padding: .75rem;
}

.p-4 {
  padding: 1rem;
}

.p-5 {
  padding: 1.25rem;
}

.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.py-2 {
  padding-top: .5rem;
  padding-bottom: .5rem;
}

.py-3 {
  padding-top: .75rem;
  padding-bottom: .75rem;
}

.pb-2\.5 {
  padding-bottom: .625rem;
}

.pt-3\.5 {
  padding-top: .875rem;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.font-mono {
  font-family: JetBrains Mono, ui-monospace, monospace;
}

.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}

.text-sm {
  font-size: .875rem;
  line-height: 1.25rem;
}

.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}

.text-xs {
  font-size: .75rem;
  line-height: 1rem;
}

.font-bold {
  font-weight: 700;
}

.font-extrabold {
  font-weight: 800;
}

.font-medium {
  font-weight: 500;
}

.font-semibold {
  font-weight: 600;
}

.uppercase {
  text-transform: uppercase;
}

.lowercase {
  text-transform: lowercase;
}

.tracking-tight {
  letter-spacing: -.025em;
}

.text-\[var\(--folio-muted\)\] {
  color: var(--folio-muted);
}

.text-amber-400 {
  --tw-text-opacity: 1;
  color: rgb(251 191 36 / var(--tw-text-opacity, 1));
}

.text-gray-500 {
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
}

.text-on-surface {
  --tw-text-opacity: 1;
  color: rgb(25 28 30 / var(--tw-text-opacity, 1));
}

.text-on-surface-variant {
  --tw-text-opacity: 1;
  color: rgb(69 70 77 / var(--tw-text-opacity, 1));
}

.text-red-400 {
  --tw-text-opacity: 1;
  color: rgb(248 113 113 / var(--tw-text-opacity, 1));
}

.text-red-700 {
  --tw-text-opacity: 1;
  color: rgb(185 28 28 / var(--tw-text-opacity, 1));
}

.underline {
  text-decoration-line: underline;
}

.opacity-25 {
  opacity: .25;
}

.opacity-40 {
  opacity: .4;
}

.opacity-50 {
  opacity: .5;
}

.opacity-60 {
  opacity: .6;
}

.opacity-70 {
  opacity: .7;
}

.opacity-80 {
  opacity: .8;
}

.outline {
  outline-style: solid;
}

.ring {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0, 0, 0, 0));
}

.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.transition {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-duration: .15s;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
}

.\[payment\:cash\] {
  payment: cash;
}

.\[period_series\:11111111-1111-1111-1111-111111111111\] {
  period_series: 11111100-1111-1111-1111-111111000000;
}

@font-face {
  font-family: FolioIcons;
  font-style: normal;
  font-weight: 100 700;
  font-display: block;
  src: url("https://fonts.gstatic.com/s/materialsymbolsoutlined/v367/kJEhBvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oFsLjBuVY.woff2") format("woff2");
}

.material-symbols-outlined {
  letter-spacing: normal;
  text-transform: none;
  vertical-align: middle;
  white-space: nowrap;
  word-wrap: normal;
  font-feature-settings: "liga";
  -webkit-font-feature-settings: "liga";
  -moz-font-feature-settings: "liga";
  font-variant-ligatures: common-ligatures discretionary-ligatures;
  text-rendering: optimizelegibility;
  -webkit-font-smoothing: antialiased;
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
  direction: ltr;
  justify-content: center;
  align-items: center;
  width: 1em;
  height: 1em;
  font-family: FolioIcons, sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  display: inline-flex;
  overflow: hidden;
}

*, :before, :after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html, body {
  height: 100%;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
}

body {
  background: var(--folio-bg);
  color: var(--folio-text);
}

.folio-layout {
  grid-template-columns: var(--folio-nav-w) 1fr;
  background: var(--surface);
  min-height: 100vh;
  color: var(--on-surface);
  display: grid;
}

.folio-layout .folio-main {
  background: var(--surface-container-low);
  width: 100%;
  max-width: 1400px;
  min-height: 100vh;
  margin-inline: auto;
  padding: 1.25rem 1rem 6rem;
}

@media (width >= 768px) {
  .folio-layout .folio-main {
    padding: 2rem 2rem 4rem;
  }
}

.folio-layout .folio-sidebar {
  height: 100vh;
  width: var(--folio-nav-w);
  background: var(--surface-container-lowest);
  border-right: 1px solid color-mix(in srgb, var(--outline-variant) 40%, transparent);
  flex-direction: column;
  align-self: start;
  padding: 1.25rem .75rem;
  display: flex;
  position: sticky;
  top: 0;
  overflow: hidden;
}

.folio-layout .sidebar-brand {
  flex-shrink: 0;
  margin-bottom: 1.5rem;
  padding: 0 .5rem;
}

.folio-layout .sidebar-brand-link {
  color: inherit;
  flex-direction: column;
  gap: .15rem;
  text-decoration: none;
  display: flex;
}

.folio-layout .sidebar-brand-link:hover .sidebar-logo {
  color: var(--on-surface);
}

.folio-layout .sidebar-logo {
  letter-spacing: -.04em;
  color: var(--on-surface);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.2;
  display: block;
}

.folio-layout .sidebar-role {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--on-surface-variant);
  margin-top: .15rem;
  font-size: .65rem;
  font-weight: 700;
  display: block;
}

.folio-layout .sidebar-scroll {
  flex-direction: column;
  flex: 1;
  gap: 1.25rem;
  padding-bottom: 1rem;
  display: flex;
  overflow: hidden auto;
}

.folio-layout .nav-group {
  flex-direction: column;
  gap: .25rem;
  display: flex;
}

.folio-layout .nav-group-label {
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--outline);
  padding: 0 .75rem .35rem;
  font-size: .6rem;
  font-weight: 700;
  display: block;
}

.folio-layout .nav-list {
  flex-direction: column;
  gap: .15rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.folio-layout .nav-link {
  color: var(--on-surface-variant);
  letter-spacing: .05em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: background .15s var(--ease-out),
    color .15s var(--ease-out),
    border-color .15s var(--ease-out),
    transform .12s var(--ease-out);
  border-right: 4px solid rgba(0, 0, 0, 0);
  border-radius: .375rem;
  align-items: center;
  gap: .75rem;
  padding: .55rem .75rem;
  font-size: .72rem;
  font-weight: 700;
  text-decoration: none;
  display: flex;
}

.folio-layout .nav-link-icon {
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 20;
  flex-shrink: 0;
  font-size: 18px;
  line-height: 1;
}

.folio-layout .nav-link-label {
  text-overflow: ellipsis;
  overflow: hidden;
}

@media (hover: hover) and (pointer: fine) {
  .folio-layout .nav-link:hover {
    background: var(--surface-container-low);
    color: var(--on-surface);
  }
}

.folio-layout .nav-link:active {
  transform: scale(.97);
}

.folio-layout .nav-link--active {
  background: var(--surface-container-high);
  color: var(--on-surface);
  border-right-color: var(--on-surface);
}

.folio-layout .nav-link--active .nav-link-icon {
  font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 20;
}

.folio-layout .sidebar-footer {
  border-top: 1px solid rgba(198, 198, 205, .35);
  flex-direction: column;
  flex-shrink: 0;
  gap: .75rem;
  margin-top: auto;
  padding-top: 1rem;
  display: flex;
}

.folio-layout .nav-list--footer {
  gap: .1rem;
}

.folio-layout .sidebar-user {
  align-items: center;
  gap: .65rem;
  padding: .5rem .35rem .15rem;
  display: flex;
}

.folio-layout .sidebar-avatar {
  background: var(--navy);
  color: #fff;
  letter-spacing: .02em;
  border-radius: 9999px;
  flex-shrink: 0;
  place-items: center;
  width: 2rem;
  height: 2rem;
  font-size: .7rem;
  font-weight: 700;
  display: grid;
}

.folio-layout .sidebar-user-info {
  flex-direction: column;
  flex: 1;
  gap: .05rem;
  min-width: 0;
  display: flex;
}

.folio-layout .sidebar-user-name {
  color: var(--on-surface);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: .8rem;
  font-weight: 600;
  overflow: hidden;
}

.folio-layout .sidebar-user-role {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--outline);
  font-size: .6rem;
  font-weight: 700;
}

.folio-layout .sidebar-logout-btn {
  width: 2rem;
  height: 2rem;
  color: var(--outline);
  cursor: pointer;
  transition: background .15s var(--ease-out),
    color .15s var(--ease-out),
    transform .12s var(--ease-out);
  background: none;
  border: none;
  border-radius: .375rem;
  place-items: center;
  display: grid;
}

@media (hover: hover) and (pointer: fine) {
  .folio-layout .sidebar-logout-btn:hover {
    background: var(--surface-container-low);
    color: var(--on-surface);
  }
}

.folio-layout .sidebar-logout-btn:active {
  transform: scale(.97);
}

.folio-layout .sidebar-loading {
  width: var(--folio-nav-w);
  background: var(--surface-container-lowest);
  border-right: 1px solid var(--surface-container-high);
  height: 100vh;
}

@media (prefers-reduced-motion: reduce) {
  .folio-layout .nav-link, .folio-layout .sidebar-logout-btn {
    transition: background .15s, color .15s, border-color .15s;
  }

  .folio-layout .nav-link:active, .folio-layout .sidebar-logout-btn:active {
    transform: none;
  }
}

.folio-layout .folio-main__toolbar, .folio-layout--vendor .folio-main__toolbar, .folio-layout--tenant .folio-main__toolbar {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  margin: -.5rem 0 1rem;
  display: flex;
}

.folio-desk-switcher {
  flex-wrap: wrap;
  flex: 1;
  align-items: center;
  gap: .375rem;
  min-width: 12rem;
  display: flex;
}

.folio-desk-switcher__label {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--folio-muted, var(--on-surface-variant));
  padding: 0 .25rem;
  font-size: .625rem;
  font-weight: 700;
}

.folio-desk-switcher__btn {
  border: 1px solid var(--folio-border, var(--surface-container-high));
  background: var(--surface-container-lowest);
  min-height: 2rem;
  color: var(--folio-text, var(--on-surface));
  cursor: pointer;
  border-radius: 999px;
  align-items: center;
  padding: .25rem .65rem;
  font-size: .75rem;
  font-weight: 700;
  text-decoration: none;
  display: inline-flex;
}

.folio-desk-switcher__btn--on {
  background: var(--navy);
  border-color: var(--navy);
  color: #fff;
}

.folio-desk-switcher__add {
  margin-left: auto;
}

.desk-chooser-grid {
  flex-direction: column;
  gap: .75rem;
  margin-top: 1.25rem;
  display: flex;
}

.desk-card {
  text-align: left;
  border: 1.5px solid var(--outline-variant);
  background: var(--surface-container-lowest);
  cursor: pointer;
  border-radius: 12px;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  padding: 1.1rem 1.15rem;
  display: flex;
}

.desk-card--last {
  border-color: var(--navy);
  background: rgba(19, 27, 46, .03);
}

.desk-card .material-symbols-outlined {
  font-size: 1.35rem;
}

.desk-card__title {
  letter-spacing: -.02em;
  margin-top: .5rem;
  font-size: 1.05rem;
  font-weight: 800;
}

.desk-card__last {
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--on-surface-variant);
  margin-top: .2rem;
  font-size: .65rem;
  font-weight: 700;
}

.desk-card__body {
  color: var(--on-surface-variant);
  margin-top: .4rem;
  font-size: .8rem;
  line-height: 1.55;
}

.desk-card__go {
  color: var(--navy);
  margin-top: .85rem;
  font-size: .78rem;
  font-weight: 700;
}

@media (width >= 768px) {
  .desk-chooser-grid {
    grid-template-columns: 1fr 1fr;
    display: grid;
  }
}

.folio-nav-toggle {
  border: 1px solid var(--folio-border, var(--surface-container-high));
  background: var(--surface-container-lowest);
  width: 2.5rem;
  height: 2.5rem;
  color: var(--folio-text, var(--on-surface));
  cursor: pointer;
  border-radius: .5rem;
  justify-content: center;
  align-items: center;
  display: none;
}

.folio-nav-toggle .material-symbols-outlined {
  font-size: 1.35rem;
}

.folio-nav-backdrop {
  display: none;
}

@media (width <= 1023px) {
  .folio-layout, .folio-layout, .folio-layout--vendor, .folio-layout--tenant {
    grid-template-columns: 1fr;
  }

  .folio-layout > .folio-sidebar, .folio-layout > .folio-sidebar, .folio-layout--vendor > .folio-sidebar, .folio-layout--tenant > .folio-sidebar {
    z-index: 50;
    width: min(18rem, 86vw);
    height: 100vh;
    box-shadow: none;
    transition: transform .18s;
    position: fixed;
    inset: 0 auto 0 0;
    transform: translateX(-110%);
  }

  .folio-layout.folio-nav-open > .folio-sidebar, .folio-layout.folio-nav-open > .folio-sidebar, .folio-layout--vendor.folio-nav-open > .folio-sidebar, .folio-layout--tenant.folio-nav-open > .folio-sidebar {
    transform: translateX(0);
    box-shadow: 8px 0 24px rgba(15, 23, 42, .18);
  }

  .folio-nav-toggle {
    display: inline-flex;
  }

  .folio-nav-open .folio-nav-backdrop {
    z-index: 40;
    background: rgba(15, 23, 42, .4);
    display: block;
    position: fixed;
    inset: 0;
  }

  .folio-layout .folio-main__toolbar {
    justify-content: space-between;
  }
}

.folio-search-trigger {
  border: 1px solid var(--folio-border, var(--surface-container-high));
  background: var(--surface-container-lowest);
  color: var(--folio-muted, var(--on-surface-variant));
  cursor: pointer;
  border-radius: .5rem;
  align-items: center;
  gap: .5rem;
  padding: .45rem .75rem;
  font-size: .8125rem;
  display: inline-flex;
}

.folio-search-trigger__kbd {
  background: var(--surface-container-low);
  color: var(--on-surface-variant);
  border-radius: .25rem;
  margin-left: .25rem;
  padding: .1rem .35rem;
  font-size: .7rem;
}

.folio-search-backdrop {
  z-index: 1200;
  background: rgba(15, 23, 42, .35);
  justify-content: center;
  align-items: flex-start;
  padding: 12vh 1rem 1rem;
  display: flex;
  position: fixed;
  inset: 0;
}

.folio-search-panel {
  background: var(--surface-container-lowest);
  border-radius: .75rem;
  width: min(36rem, 100%);
  overflow: hidden;
  box-shadow: 0 24px 48px rgba(15, 23, 42, .18);
}

.folio-search-input-wrap {
  border-bottom: 1px solid var(--surface-container-high);
  align-items: center;
  gap: .65rem;
  padding: .85rem 1rem;
  display: flex;
}

.folio-search-input {
  color: var(--on-surface);
  background: none;
  border: none;
  outline: none;
  flex: 1;
  font-size: 1rem;
}

.folio-search-results {
  max-height: min(22rem, 50vh);
  margin: 0;
  padding: .35rem;
  list-style: none;
  overflow: auto;
}

.folio-search-row {
  text-align: left;
  cursor: pointer;
  width: 100%;
  color: var(--on-surface);
  background: none;
  border: none;
  border-radius: .5rem;
  align-items: baseline;
  gap: .75rem;
  padding: .65rem .75rem;
  display: flex;
}

.folio-search-row--active, .folio-search-row:hover {
  background: var(--surface-container-low);
}

.folio-search-row__group {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--on-surface-variant);
  min-width: 5.5rem;
  font-size: .65rem;
  font-weight: 700;
}

.folio-search-row__label {
  font-size: .9rem;
  font-weight: 600;
}

.folio-search-empty {
  text-align: center;
  color: var(--on-surface-variant);
  padding: 1.25rem;
  font-size: .875rem;
}

.folio-related {
  flex-wrap: wrap;
  align-items: center;
  gap: .65rem;
  margin: -.75rem 0 1.25rem;
  display: flex;
}

.folio-related__label {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--on-surface-variant);
  font-size: .65rem;
  font-weight: 700;
}

.folio-related__list {
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.folio-related__link {
  color: var(--on-surface);
  background: #eef2f6;
  border-radius: 999px;
  padding: .3rem .65rem;
  font-size: .75rem;
  font-weight: 600;
  text-decoration: none;
  display: inline-flex;
}

.folio-setup__sections {
  flex-direction: column;
  gap: 1.75rem;
  display: flex;
}

.folio-setup__heading {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--on-surface-variant);
  margin: 0 0 .65rem;
  font-size: .7rem;
  font-weight: 700;
}

.folio-setup__list {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .35);
  border-radius: .75rem;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
}

.folio-setup__row {
  color: inherit;
  border-bottom: 1px solid var(--surface-container-low);
  align-items: center;
  gap: .85rem;
  padding: .9rem 1rem;
  text-decoration: none;
  display: flex;
}

.folio-setup__list li:last-child .folio-setup__row {
  border-bottom: none;
}

.folio-setup__icon {
  color: var(--on-surface);
  font-size: 1.25rem;
}

.folio-setup__text {
  flex-direction: column;
  flex: 1;
  gap: .15rem;
  min-width: 0;
  display: flex;
}

.folio-setup__title {
  color: var(--on-surface);
  font-size: .95rem;
  font-weight: 700;
}

.folio-setup__purpose {
  color: var(--on-surface-variant);
  font-size: .8rem;
}

.folio-setup__chevron {
  color: #94a3b8;
  font-size: 1.1rem;
}

.folio-form-page {
  width: 100%;
  max-width: 40rem;
}

@media (width >= 768px) {
  .folio-form-page {
    max-width: 48rem;
  }
}

@media (width >= 1024px) {
  .folio-form-page {
    max-width: 56rem;
  }
}

.folio-detail-split {
  flex-direction: column;
  gap: 1.25rem;
  width: 100%;
  display: flex;
}

@media (width >= 1024px) {
  .folio-detail-split {
    grid-template-columns: minmax(0, 1.4fr) minmax(16rem, 1fr);
    align-items: start;
    gap: 1.5rem 2rem;
    display: grid;
  }

  .folio-detail-split__aside {
    position: sticky;
    top: 1.5rem;
  }
}

.folio-form {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .35);
  border-radius: .75rem;
  flex-direction: column;
  gap: 1rem;
  padding: 1.25rem;
  display: flex;
}

.folio-form__row {
  grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
  gap: .75rem;
  display: grid;
}

.folio-field--check {
  flex-direction: row;
  align-items: center;
  gap: .5rem;
}

.folio-field__label {
  font-size: var(--folio-text-label, .66rem);
  font-weight: var(--folio-text-label-weight, 700);
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--on-surface-variant);
}

.folio-field__hint {
  color: var(--outline);
  margin: 0;
  font-size: .72rem;
  font-weight: 400;
}

.folio-input, .folio-select, textarea.folio-input {
  appearance: none;
  box-sizing: border-box;
  background-color: var(--surface-container);
  width: 100%;
  min-height: 2.75rem;
  font-size: var(--folio-text-input, .9rem);
  color: var(--on-surface);
  box-shadow: none;
  border: none;
  border-radius: 12px;
  outline: none;
  padding: .8rem 1rem;
  font-family: inherit;
  line-height: 1.4;
  transition: background-color .18s cubic-bezier(.23, 1, .32, 1), box-shadow .18s cubic-bezier(.23, 1, .32, 1);
}

textarea.folio-input {
  resize: vertical;
  min-height: 6.5rem;
}

.folio-input::-moz-placeholder {
  color: #8b8c93;
}

.folio-select::-moz-placeholder {
  color: #8b8c93;
}

textarea.folio-input::-moz-placeholder {
  color: #8b8c93;
}

.folio-input::placeholder {
  color: #8b8c93;
}

.folio-select::placeholder {
  color: #8b8c93;
}

textarea.folio-input::placeholder {
  color: #8b8c93;
}

@media (hover: hover) {
  .folio-input:hover, .folio-select:hover, textarea.folio-input:hover {
    background-color: var(--surface-container-high);
  }
}

.folio-input:focus, .folio-select:focus, textarea.folio-input:focus {
  background-color: var(--surface-container-lowest);
  outline: none;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(19, 27, 46, .28);
}

.folio-input:focus-visible {
  background-color: var(--surface-container-lowest);
  outline: none;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(19, 27, 46, .28);
}

.folio-select:focus-visible {
  background-color: var(--surface-container-lowest);
  outline: none;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(19, 27, 46, .28);
}

textarea.folio-input:focus-visible {
  background-color: var(--surface-container-lowest);
  outline: none;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(19, 27, 46, .28);
}

.folio-select {
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24'%3E%3Cpath fill='%2345464d' d='M8.12 9.29 12 13.17l3.88-3.88a.996.996 0 1 1 1.41 1.41l-4.59 4.59a.996.996 0 0 1-1.41 0L6.7 10.7a.996.996 0 0 1 0-1.41c.39-.38 1.02-.39 1.42 0z'/%3E%3C/svg%3E");
  background-position: right 1rem center;
  background-repeat: no-repeat;
  padding-right: 2.6rem;
}

.folio-opt-grid {
  grid-template-columns: 1fr;
  gap: .6rem;
  display: grid;
}

@media (width >= 520px) {
  .folio-opt-grid--2 {
    grid-template-columns: 1fr 1fr;
  }
}

.folio-opt {
  text-align: left;
  background: var(--surface-container-lowest);
  border: 1.5px solid var(--outline-variant);
  cursor: pointer;
  color: inherit;
  border-radius: 12px;
  flex-direction: column;
  gap: .35rem;
  padding: .85rem 1rem;
  font-family: inherit;
  transition: border-color .15s, background-color .15s, transform .16s cubic-bezier(.23, 1, .32, 1);
  display: flex;
}

.folio-opt:active {
  transform: scale(.985);
}

@media (hover: hover) {
  .folio-opt:hover {
    border-color: var(--navy);
  }
}

.folio-opt--sel {
  border-color: var(--navy);
  background: rgba(19, 27, 46, .04);
}

.folio-opt__label {
  color: var(--on-surface);
  font-size: .8rem;
  font-weight: 600;
}

.folio-opt__price {
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
  font-size: 1.15rem;
  font-weight: 800;
}

.folio-opt__desc {
  color: var(--outline);
  font-size: .72rem;
  line-height: 1.45;
}

.folio-layout .form-label, .folio-layout .folio-form__label, .folio-layout .insp-form-label {
  font-size: var(--folio-text-label, .75rem);
  font-weight: var(--folio-text-label-weight, 700);
  letter-spacing: .03em;
  text-transform: uppercase;
  color: var(--on-surface-variant);
  margin-bottom: .35rem;
  display: block;
}

.folio-layout .form-input, .folio-layout .form-select {
  appearance: none;
  box-sizing: border-box;
  background-color: var(--surface-container);
  width: 100%;
  min-height: 2.75rem;
  font-size: var(--folio-text-input, .9rem);
  color: var(--on-surface);
  box-shadow: none;
  border: none;
  border-radius: 12px;
  outline: none;
  padding: .8rem 1rem;
  font-family: inherit;
  transition: background-color .18s cubic-bezier(.23, 1, .32, 1), box-shadow .18s cubic-bezier(.23, 1, .32, 1);
}

.folio-layout .form-input:focus, .folio-layout .form-select:focus {
  background-color: var(--surface-container-lowest);
  outline: none;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(19, 27, 46, .28);
}

.folio-error {
  color: #b91c1c;
  margin: 0;
  font-size: .875rem;
}

.folio-muted {
  color: var(--on-surface-variant);
  font-size: .875rem;
}

.leases-header {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  display: flex;
}

.folio-page-header {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1.25rem;
  margin-bottom: 1.75rem;
  display: flex;
}

.folio-page-header__title {
  font-size: var(--folio-text-page);
  font-weight: var(--folio-text-page-weight);
  letter-spacing: -.02em;
  color: var(--on-surface);
  margin: 0;
  line-height: 1.15;
}

.folio-page-header__subtitle {
  font-size: var(--folio-text-subtitle, .875rem);
  font-weight: var(--folio-text-subtitle-weight, 500);
  color: var(--on-surface-variant);
  margin-top: .35rem;
}

.folio-page-header__actions {
  flex-shrink: 0;
  align-items: center;
  gap: .5rem;
  display: flex;
}

.folio-btn {
  font-size: var(--folio-text-btn, .8125rem);
  font-weight: var(--folio-text-btn-weight, 600);
  cursor: pointer;
  transition: transform .12s var(--ease-out, cubic-bezier(.23, 1, .32, 1)),
    opacity .15s ease,
    box-shadow .15s ease;
  border: none;
  border-radius: .375rem;
  justify-content: center;
  align-items: center;
  gap: .4rem;
  padding: .625rem 1rem;
  font-family: inherit;
  text-decoration: none;
  display: inline-flex;
}

.folio-btn:active {
  transform: scale(.97);
}

.folio-btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.folio-btn--sm {
  padding: .35rem .7rem;
}

.folio-btn--primary {
  color: var(--on-primary);
  background: var(--primary);
  box-shadow: none;
  background-image: none;
}

@media (hover: hover) and (pointer: fine) {
  .folio-btn--primary:hover {
    background: var(--primary-hover);
  }
}

.folio-btn--ghost {
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  border: 1px solid rgba(198, 198, 205, .45);
}

@media (hover: hover) and (pointer: fine) {
  .folio-btn--ghost:hover {
    background: var(--surface-container-low);
  }
}

.folio-btn .material-symbols-outlined {
  font-size: 18px;
  line-height: 1;
}

.folio-btn:disabled, .folio-btn[disabled], .folio-btn[aria-disabled="true"] {
  opacity: .45;
  cursor: not-allowed;
  pointer-events: none;
}

.modal-backdrop {
  z-index: 1100;
  -webkit-backdrop-filter: blur(2px);
  box-sizing: border-box;
  background: rgba(25, 28, 30, .45);
  justify-content: center;
  align-items: center;
  padding: 1.25rem;
  display: flex;
  position: fixed;
  inset: 0;
}

.modal-card {
  background: var(--surface-container-lowest);
  width: 100%;
  max-width: 28rem;
  max-height: min(90vh, 40rem);
  color: var(--on-surface);
  border: 1px solid rgba(198, 198, 205, .45);
  border-radius: .75rem;
  overflow: auto;
  box-shadow: 0 24px 48px rgba(25, 28, 30, .18);
}

@media (width >= 768px) {
  .modal-card {
    max-width: 32rem;
  }
}

@media (width >= 1024px) {
  .modal-card {
    max-width: 36rem;
  }
}

.modal-card.folio-sheet {
  border-radius: 0;
  max-height: none;
}

.modal-header {
  border-bottom: 1px solid rgba(198, 198, 205, .35);
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.modal-title {
  letter-spacing: -.02em;
  color: var(--on-surface);
  margin: 0;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.25;
}

.modal-close {
  width: 2rem;
  height: 2rem;
  color: var(--on-surface-variant);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: .375rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0;
  font-family: inherit;
  font-size: 1.25rem;
  line-height: 1;
  display: inline-flex;
}

.modal-close:hover {
  background: var(--surface-container-low);
  color: var(--on-surface);
}

.modal-close .material-symbols-outlined {
  font-size: 20px;
  line-height: 1;
}

.modal-body {
  flex-direction: column;
  gap: .85rem;
  padding: 1.25rem;
  display: flex;
}

.modal-footer {
  border-top: 1px solid rgba(198, 198, 205, .35);
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .5rem;
  padding: 1rem 1.25rem;
  display: flex;
}

@media (prefers-reduced-motion: reduce) {
  .modal-backdrop {
    -webkit-backdrop-filter: none;
  }
}

.folio-tab-bar, .hub-tab-bar, .unit-tab-bar, .mq-tabs {
  -webkit-overflow-scrolling: touch;
  border-bottom: 1px solid rgba(198, 198, 205, .35);
  gap: 0;
  margin-bottom: 1.5rem;
  display: flex;
  overflow-x: auto;
}

.folio-tab, .hub-tab, .unit-tab, .mq-tab {
  font-size: var(--folio-text-tab, .75rem);
  font-weight: var(--folio-text-tab-weight, 700);
  color: var(--on-surface-variant);
  cursor: pointer;
  white-space: nowrap;
  background: none;
  border: none;
  border-bottom: 2px solid rgba(0, 0, 0, 0);
  align-items: center;
  gap: .35rem;
  padding: .625rem 1rem;
  font-family: inherit;
  text-decoration: none;
  display: inline-flex;
}

.folio-tab:hover, .hub-tab:hover, .unit-tab:hover, .mq-tab:hover {
  color: var(--on-surface);
}

.folio-tab--active, .hub-tab--active, .unit-tab--active, .mq-tab--active {
  color: var(--on-surface);
  border-bottom-color: var(--on-surface);
}

.folio-segment-bar, .dash-mode-bar {
  background: var(--surface-container-high);
  border-radius: 10px;
  align-self: flex-start;
  gap: 2px;
  margin-bottom: 1.25rem;
  padding: 3px;
  display: inline-flex;
}

.folio-segment, .dash-mode-btn {
  font-size: var(--folio-text-tab, .75rem);
  color: var(--on-surface-variant);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 8px;
  align-items: center;
  gap: .4rem;
  padding: .35rem .8rem;
  font-family: inherit;
  font-weight: 600;
  display: inline-flex;
}

.folio-segment--active, .dash-mode-btn--active {
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  box-shadow: 0 1px 2px rgba(25, 28, 30, .1);
}

.folio-stat-grid {
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 1rem;
  display: grid;
}

.tenant-home-snapshot {
  color: inherit;
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .2);
  border-radius: .75rem;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 1.25rem;
  text-decoration: none;
  transition: transform .12s cubic-bezier(.23, 1, .32, 1), border-color .15s cubic-bezier(.23, 1, .32, 1), box-shadow .15s cubic-bezier(.23, 1, .32, 1);
  display: flex;
  box-shadow: 0 1px 2px rgba(25, 28, 30, .04);
}

.tenant-lease-place {
  align-items: flex-start;
  gap: .875rem;
  min-width: 0;
  display: flex;
}

.tenant-lease-place__icon {
  width: 1.5rem;
  height: 1.5rem;
  color: var(--on-surface-variant);
  flex: none;
  line-height: 1;
  overflow: hidden;
  font-size: 1.5rem !important;
}

.tenant-lease-place__body {
  min-width: 0;
}

.tenant-lease-place__eyebrow {
  color: #62636a;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-size: .65rem;
  font-weight: 700;
  line-height: 1.2;
}

.tenant-lease-place__unit {
  color: var(--on-surface);
  letter-spacing: -.025em;
  margin-top: .25rem;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.2;
}

.tenant-lease-place__address {
  color: var(--on-surface-variant);
  text-wrap: pretty;
  margin-top: .25rem;
  font-size: .875rem;
  line-height: 1.4;
}

.tenant-home-snapshot__chevron {
  color: var(--outline);
  flex: none;
  font-size: 1.25rem !important;
}

@media (hover: hover) and (pointer: fine) {
  .tenant-home-snapshot:hover {
    border-color: rgba(15, 23, 42, .18);
    box-shadow: 0 6px 12px -4px rgba(25, 28, 30, .08);
  }
}

.tenant-home-snapshot:focus-visible {
  outline: 2px solid var(--navy);
  outline-offset: 2px;
}

.tenant-home-snapshot:active {
  transform: scale(.97);
}

@media (width <= 520px) {
  .tenant-home-snapshot {
    padding: 1rem;
  }

  .tenant-lease-place__unit {
    font-size: 1.125rem;
  }
}

.tdocs-page {
  padding-bottom: 2rem;
}

.tdocs-hero-grid {
  grid-template-columns: 1fr;
  gap: 1rem;
  margin-bottom: 1.25rem;
  display: grid;
}

@media (width >= 1024px) {
  .tdocs-hero-grid {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: 1.5rem;
  }
}

.tdocs-vault {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .35);
  border-radius: .75rem;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  display: flex;
  box-shadow: 0 1px 2px rgba(25, 28, 30, .04);
}

.tdocs-vault__icon {
  background: var(--navy);
  color: #fff;
  border-radius: .75rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 2.75rem;
  height: 2.75rem;
  display: flex;
}

.tdocs-vault__icon .material-symbols-outlined {
  font-variation-settings: "FILL" 1;
  font-size: 22px;
}

.tdocs-vault__title {
  color: var(--on-surface);
  margin: 0;
  font-size: .875rem;
  font-weight: 700;
}

.tdocs-vault__copy {
  color: var(--on-surface-variant);
  margin: .2rem 0 0;
  font-size: .75rem;
}

.tdocs-vault__count {
  color: var(--outline);
  white-space: nowrap;
  margin: 0 0 0 auto;
  font-size: .75rem;
}

.tdocs-sign {
  background: rgba(255, 218, 214, .3);
  border: 1px solid rgba(242, 184, 181, .6);
  border-radius: .75rem;
  align-items: center;
  gap: .75rem;
  padding: .9rem 1rem;
  display: flex;
}

.tdocs-sign__title {
  color: var(--on-surface);
  margin: 0;
  font-size: .875rem;
  font-weight: 700;
}

.tdocs-sign__copy {
  color: var(--on-surface-variant);
  margin: .15rem 0 0;
  font-size: .75rem;
}

.tdocs-filters {
  flex-wrap: wrap;
  margin-bottom: 1.25rem;
}

@media (width <= 480px) {
  .tdocs-filters {
    flex-wrap: nowrap;
    width: 100%;
    max-width: none;
    overflow-x: visible;
  }

  .tdocs-filters [role="tab"] {
    flex: auto;
    justify-content: center;
    gap: .15rem;
    min-width: 0;
    padding: .35rem .25rem;
    font-size: .7rem;
  }

  .tdocs-filters .cnt {
    padding-inline: .2rem;
  }
}

.tdocs-chip-count {
  color: var(--outline);
  margin-left: .2rem;
  font-size: .62rem;
  font-weight: 700;
}

.landlord-chip--active .tdocs-chip-count {
  color: var(--navy);
}

.tdocs-groups {
  grid-template-columns: 1fr;
  align-items: start;
  gap: 1.5rem;
  display: grid;
}

@media (width >= 1024px) {
  .tdocs-groups {
    grid-template-columns: 1fr 1fr;
  }
}

.tdocs-kicker {
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--on-surface-variant);
  margin: 0 0 .5rem;
  font-size: .625rem;
  font-weight: 700;
}

.tdocs-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.tdocs-row {
  align-items: center;
  gap: .5rem;
  padding: .7rem 1rem;
  display: flex;
}

.tdocs-row + .tdocs-row {
  border-top: 1px solid rgba(198, 198, 205, .25);
}

.tdocs-row__main {
  text-align: left;
  cursor: pointer;
  min-width: 0;
  color: inherit;
  background: none;
  border: 0;
  flex: 1;
  align-items: center;
  gap: .75rem;
  padding: 0;
  display: flex;
}

.tdocs-row__body {
  flex-direction: column;
  align-items: flex-start;
  gap: .2rem;
  min-width: 0;
  display: flex;
}

.tdocs-row__title {
  color: var(--on-surface);
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
  font-size: .875rem;
  font-weight: 600;
  overflow: hidden;
}

.tdocs-row__meta {
  color: var(--on-surface-variant);
  font-size: .75rem;
}

.tdocs-row__dl {
  width: 2rem;
  height: 2rem;
  color: var(--on-surface-variant);
  border-radius: .5rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: flex;
}

.tdocs-row__dl .material-symbols-outlined {
  font-size: 18px;
}

.tdocs-ico {
  border-radius: 9px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 34px;
  height: 34px;
  display: flex;
}

.tdocs-ico .material-symbols-outlined {
  font-size: 18px;
}

.tdocs-ico--red {
  background: var(--error-container);
  color: var(--on-error-container);
}

.tdocs-ico--amber {
  background: var(--warning-container);
  color: var(--on-warning-container);
}

.tdocs-ico--green {
  color: var(--green);
  background: rgba(104, 219, 169, .22);
}

.tdocs-ico--neutral {
  background: var(--surface-container);
  color: var(--on-surface-variant);
}

.tdocs-footnote {
  color: var(--on-surface-variant);
  margin: .5rem 0 0;
  font-size: .75rem;
}

.tdocs-footnote a {
  color: var(--on-surface);
  font-weight: 600;
  text-decoration: underline;
}

.tdocs-empty {
  text-align: center;
  color: var(--on-surface-variant);
  padding: 2.5rem 1rem;
  font-size: .875rem;
}

.tdocs-empty--error {
  color: var(--error);
}

.tdocs-empty-card {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .35);
  border-radius: .75rem;
  flex-direction: column;
  align-items: flex-start;
  gap: .4rem;
  padding: 1.5rem 1.25rem;
  display: flex;
  box-shadow: 0 1px 2px rgba(25, 28, 30, .04);
}

@media (width >= 1024px) {
  .tdocs-empty-card {
    grid-column: 1 / -1;
    max-width: none;
  }
}

.tdocs-empty-card__icon {
  background: var(--surface-container);
  width: 2.75rem;
  height: 2.75rem;
  color: var(--on-surface-variant);
  border-radius: .75rem;
  justify-content: center;
  align-items: center;
  margin-bottom: .35rem;
  display: flex;
}

.tdocs-empty-card__title {
  color: var(--on-surface);
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
}

.tdocs-empty-card__copy {
  color: var(--on-surface-variant);
  max-width: 36rem;
  margin: 0;
  font-size: .875rem;
}

.tdocs-detail {
  grid-template-columns: max-content 1fr;
  gap: .5rem 1.25rem;
  margin: 0;
  font-size: .875rem;
  display: grid;
}

.tdocs-detail dt {
  color: var(--on-surface-variant);
  font-weight: 600;
}

.tdocs-detail dd {
  color: var(--on-surface);
  margin: 0;
}

.tdocs-sign-note {
  color: var(--on-warning-container);
  background: rgba(255, 221, 176, .35);
  border-radius: .5rem;
  margin: 1rem 0 0;
  padding: .85rem 1rem;
  font-size: .8125rem;
}

.folio-stat-card {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .15);
  border-radius: .75rem;
  align-items: flex-start;
  gap: .85rem;
  min-height: 5.5rem;
  padding: 1.25rem;
  transition: transform .12s cubic-bezier(.23, 1, .32, 1), border-color .15s cubic-bezier(.23, 1, .32, 1), box-shadow .15s cubic-bezier(.23, 1, .32, 1);
  display: flex;
  box-shadow: 0 4px 6px -1px rgba(25, 28, 30, .04);
}

.folio-stat-card--link {
  color: inherit;
  cursor: pointer;
  text-decoration: none;
}

@media (hover: hover) and (pointer: fine) {
  .folio-stat-card--link:hover {
    border-color: rgba(15, 23, 42, .18);
    box-shadow: 0 6px 12px -4px rgba(25, 28, 30, .08);
  }
}

.folio-stat-card--link:active {
  transform: scale(.97);
}

.folio-stat-card__icon {
  width: 22px;
  height: 22px;
  color: var(--on-surface-variant);
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
  flex-shrink: 0;
  margin-top: .1rem;
  font-family: FolioIcons, sans-serif;
  line-height: 1;
  overflow: hidden;
  font-size: 22px !important;
}

.folio-stat-card__body {
  flex: 1;
  min-width: 0;
}

.folio-stat-card__label {
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--on-surface-variant);
  font-size: .65rem;
  font-weight: 700;
}

.folio-stat-card__value {
  letter-spacing: -.03em;
  color: var(--on-surface);
  font-variant-numeric: tabular-nums;
  margin-top: .35rem;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.1;
}

.landlord-dash {
  max-width: 72rem;
}

.landlord-dash__sections {
  grid-template-columns: 1fr;
  gap: 1.25rem;
  margin-top: 1.75rem;
  display: grid;
}

@media (width >= 960px) {
  .landlord-dash__sections {
    grid-template-columns: 1.4fr 1fr;
    align-items: start;
  }
}

.folio-section-card {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .2);
  border-radius: .75rem;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(25, 28, 30, .04);
}

.folio-section-card__header {
  border-bottom: 1px solid rgba(198, 198, 205, .25);
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.folio-section-card__title {
  font-size: var(--folio-text-section, .8125rem);
  font-weight: var(--folio-text-section-weight, 700);
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--on-surface);
}

.folio-section-card__body {
  padding: 1rem 1.25rem 1.25rem;
}

.folio-empty {
  flex-direction: column;
  align-items: flex-start;
  gap: .35rem;
  padding: .5rem 0;
  display: flex;
}

.folio-empty__icon {
  color: var(--outline);
  margin-bottom: .25rem;
  font-size: 28px;
}

.folio-empty__heading {
  color: var(--on-surface);
  font-size: .9375rem;
  font-weight: 600;
}

.folio-empty__sub {
  color: var(--on-surface-variant);
  max-width: 28rem;
  font-size: .8125rem;
  line-height: 1.45;
}

.folio-attention-list {
  flex-direction: column;
  gap: .5rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.folio-attention-item {
  background: var(--surface-container-low);
  color: inherit;
  border-radius: .5rem;
  align-items: center;
  gap: .75rem;
  padding: .75rem .85rem;
  text-decoration: none;
  transition: background .15s cubic-bezier(.23, 1, .32, 1), transform .12s cubic-bezier(.23, 1, .32, 1);
  display: flex;
}

@media (hover: hover) and (pointer: fine) {
  .folio-attention-item:hover {
    background: var(--surface-container-high);
  }
}

.folio-attention-item:active {
  transform: scale(.98);
}

.folio-attention-item__icon {
  color: #f7931a;
  flex-shrink: 0;
  font-size: 20px;
}

.folio-attention-item__text {
  flex: 1;
  min-width: 0;
}

.folio-attention-item__label {
  color: var(--on-surface);
  font-size: .875rem;
  font-weight: 600;
}

.folio-attention-item__meta {
  color: var(--on-surface-variant);
  margin-top: .1rem;
  font-size: .75rem;
}

.folio-quick-actions {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.folio-quick-action {
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  border: 1px solid rgba(198, 198, 205, .35);
  border-radius: .5rem;
  align-items: center;
  gap: .75rem;
  padding: .75rem .85rem;
  font-size: .875rem;
  font-weight: 600;
  text-decoration: none;
  transition: background .15s cubic-bezier(.23, 1, .32, 1), border-color .15s cubic-bezier(.23, 1, .32, 1), transform .12s cubic-bezier(.23, 1, .32, 1);
  display: flex;
}

@media (hover: hover) and (pointer: fine) {
  .folio-quick-action:hover {
    background: var(--surface-container-lowest);
    border-color: rgba(15, 23, 42, .2);
  }
}

.folio-quick-action:active {
  transform: scale(.97);
}

.folio-quick-action__icon {
  color: var(--on-surface-variant);
  flex-shrink: 0;
  font-size: 20px;
}

.folio-quick-action__chevron {
  color: var(--outline);
  margin-left: auto;
  font-size: 18px;
}

.folio-stat-grid > .folio-stat-card, .folio-stat-grid > a.folio-stat-card {
  animation: .28s cubic-bezier(.23, 1, .32, 1) both folio-stat-in;
}

.folio-stat-grid > :first-child {
  animation-delay: 0s;
}

.folio-stat-grid > :nth-child(2) {
  animation-delay: 40ms;
}

.folio-stat-grid > :nth-child(3) {
  animation-delay: 80ms;
}

.folio-stat-grid > :nth-child(4) {
  animation-delay: .12s;
}

.folio-stat-grid > :nth-child(5) {
  animation-delay: .16s;
}

.folio-stat-grid > :nth-child(6) {
  animation-delay: .2s;
}

@keyframes folio-stat-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .folio-stat-grid > .folio-stat-card, .folio-stat-grid > a.folio-stat-card {
    animation: none;
  }

  .folio-btn:active, .folio-stat-card--link:active, .folio-attention-item:active, .folio-quick-action:active {
    transform: none;
  }
}

.landlord-list-page {
  max-width: 72rem;
}

.landlord-filter-bar {
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem;
  margin-bottom: 1.25rem;
  display: flex;
}

.landlord-search-wrap {
  flex: 1;
  min-width: 12rem;
  position: relative;
}

.landlord-search-icon {
  color: var(--outline);
  pointer-events: none;
  font-size: 18px;
  position: absolute;
  top: 50%;
  left: .75rem;
  transform: translateY(-50%);
}

.landlord-search-input {
  background: var(--surface-container-lowest);
  width: 100%;
  color: var(--on-surface);
  border: 1px solid rgba(198, 198, 205, .45);
  border-radius: .5rem;
  outline: none;
  padding: .65rem .85rem .65rem 2.4rem;
  font-size: .875rem;
}

.landlord-search-input:focus {
  border-color: var(--on-surface);
}

.landlord-filter-chips {
  background: var(--surface-container-low);
  border-radius: .5rem;
  gap: .35rem;
  padding: .25rem;
  display: flex;
}

.landlord-chip {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--on-surface-variant);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: .375rem;
  padding: .4rem .75rem;
  font-size: .7rem;
  font-weight: 700;
  transition: background .15s cubic-bezier(.23, 1, .32, 1), color .15s;
}

.landlord-chip--active {
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  box-shadow: 0 1px 2px rgba(25, 28, 30, .08);
}

.landlord-card-grid {
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1rem;
  display: grid;
}

.landlord-card {
  background: var(--surface-container-lowest);
  color: inherit;
  border: 1px solid rgba(198, 198, 205, .2);
  border-radius: .75rem;
  flex-direction: column;
  padding: 1.15rem;
  text-decoration: none;
  transition: transform .12s cubic-bezier(.23, 1, .32, 1), border-color .15s, box-shadow .15s;
  display: flex;
  box-shadow: 0 4px 6px -1px rgba(25, 28, 30, .04);
}

.landlord-card--static {
  cursor: default;
}

@media (hover: hover) and (pointer: fine) {
  a.landlord-card:hover {
    border-color: rgba(15, 23, 42, .2);
    box-shadow: 0 6px 12px -4px rgba(25, 28, 30, .08);
  }
}

a.landlord-card:active {
  transform: scale(.98);
}

.landlord-card__top {
  justify-content: space-between;
  align-items: center;
  margin-bottom: .75rem;
  display: flex;
}

.landlord-card__icon {
  color: var(--on-surface-variant);
  font-size: 22px;
}

.landlord-card__title {
  letter-spacing: -.02em;
  color: var(--on-surface);
  margin: 0 0 .35rem;
  font-size: 1.05rem;
  font-weight: 600;
}

.landlord-card__meta {
  color: var(--on-surface-variant);
  text-transform: capitalize;
  margin: 0;
  font-size: .8rem;
}

.landlord-card__stat {
  color: var(--on-surface-variant);
  margin-top: .85rem;
  font-size: .8rem;
}

.landlord-card__stat-value {
  font-variant-numeric: tabular-nums;
  color: var(--on-surface);
  letter-spacing: -.03em;
  margin-right: .25rem;
  font-size: 1.35rem;
  font-weight: 700;
}

.landlord-pill {
  letter-spacing: .06em;
  text-transform: uppercase;
  border-radius: 9999px;
  align-items: center;
  padding: .15rem .55rem;
  font-size: .65rem;
  font-weight: 700;
  display: inline-flex;
}

.landlord-pill--ok {
  color: var(--green);
  background: rgba(6, 150, 105, .12);
  border: 1px solid rgba(6, 150, 105, .25);
}

.landlord-pill--warn {
  color: #b45309;
  background: rgba(247, 147, 26, .12);
  border: 1px solid rgba(247, 147, 26, .3);
}

.landlord-pill--muted {
  background: var(--surface-container-low);
  color: var(--on-surface-variant);
  border: 1px solid rgba(198, 198, 205, .4);
}

.reservations-table {
  display: none;
}

@media (width >= 768px) {
  .reservations-cards {
    display: none;
  }

  .reservations-table {
    display: block;
  }
}

.landlord-table-wrap {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .25);
  border-radius: .75rem;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(25, 28, 30, .04);
}

.landlord-table {
  border-collapse: collapse;
  width: 100%;
}

.landlord-table th {
  text-align: left;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--on-surface-variant);
  background: var(--surface);
  border-bottom: 1px solid rgba(198, 198, 205, .35);
  padding: .75rem 1rem;
  font-size: .65rem;
  font-weight: 700;
}

.landlord-table td {
  color: var(--on-surface);
  font-variant-numeric: tabular-nums;
  border-bottom: 1px solid rgba(198, 198, 205, .2);
  padding: .85rem 1rem;
  font-size: .875rem;
}

.landlord-table tr:last-child td {
  border-bottom: none;
}

.landlord-table__primary {
  color: var(--on-surface);
  font-weight: 600;
}

.landlord-table__meta {
  color: var(--on-surface-variant);
  margin-top: .15rem;
  font-size: .75rem;
}

.landlord-create-panel {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .35);
  border-radius: .75rem;
  margin-bottom: 1.25rem;
  padding: 1.25rem;
}

.landlord-create-panel__title {
  margin: 0 0 1rem;
  font-size: 1rem;
  font-weight: 600;
}

.landlord-create-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem 1rem;
  margin-bottom: 1rem;
  display: grid;
}

@media (width <= 720px) {
  .landlord-create-grid {
    grid-template-columns: 1fr;
  }
}

.landlord-field {
  color: var(--on-surface-variant);
  flex-direction: column;
  gap: .35rem;
  font-size: .75rem;
  font-weight: 600;
  display: flex;
}

.landlord-field--wide {
  grid-column: 1 / -1;
}

.landlord-field input, .landlord-field select {
  font: inherit;
  color: var(--on-surface);
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .55);
  border-radius: .5rem;
  padding: .55rem .7rem;
  font-size: .875rem;
  font-weight: 400;
}

.landlord-create-error {
  color: #b42318;
  margin: 0 0 .75rem;
  font-size: .8rem;
}

@media (hover: hover) and (pointer: fine) {
  .landlord-table tbody tr:hover td {
    background: var(--surface-container-low);
  }
}

@media (prefers-reduced-motion: reduce) {
  a.landlord-card:active {
    transform: none;
  }
}

.folio-nav {
  background: var(--folio-surface);
  border-right: 1px solid var(--folio-border);
  flex-direction: column;
  gap: 2rem;
  padding: 1.5rem 1rem;
  display: flex;
}

.nav-brand {
  padding: 0 .5rem;
}

.nav-logo {
  color: var(--folio-accent2);
  font-size: 1.25rem;
  font-weight: 700;
}

.nav-links {
  flex-direction: column;
  gap: .25rem;
  list-style: none;
  display: flex;
}

.nav-link {
  color: var(--folio-muted);
  border-radius: 6px;
  padding: .6rem .75rem;
  font-size: .875rem;
  text-decoration: none;
  transition: background .15s, color .15s;
  display: block;
}

.nav-link:hover, .nav-link.active {
  color: var(--folio-accent2);
  background: rgba(19, 27, 46, .12);
}

.nav-footer {
  margin-top: auto;
}

.nav-logout {
  border: 1px solid var(--folio-border);
  width: 100%;
  color: var(--folio-muted);
  cursor: pointer;
  background: none;
  border-radius: 6px;
  padding: .5rem;
  font-size: .8rem;
  transition: border-color .15s, color .15s;
}

.nav-logout:hover {
  border-color: var(--folio-accent);
  color: var(--folio-text);
}

.nav-role-badge {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--folio-accent2);
  margin-top: .15rem;
  font-size: .65rem;
  font-weight: 600;
  display: block;
}

.nav-icon {
  text-align: center;
  flex-shrink: 0;
  width: 1.1rem;
  display: inline-block;
}

.nav-link {
  color: var(--folio-muted);
  border-radius: 6px;
  align-items: center;
  gap: .6rem;
  padding: .6rem .75rem;
  font-size: .875rem;
  text-decoration: none;
  transition: background .15s, color .15s;
  display: flex;
}

.stat-card--link {
  text-decoration: none;
}

.stat-card--link:hover {
  border-color: var(--folio-accent);
}

.quick-links {
  margin-top: 2rem;
}

.quick-links-title {
  margin-bottom: 1rem;
  font-size: 1rem;
  font-weight: 600;
}

.quick-links-grid {
  flex-wrap: wrap;
  gap: .75rem;
  display: flex;
}

.quick-link {
  color: var(--folio-accent2);
  background: rgba(19, 27, 46, .1);
  border: 1px solid rgba(19, 27, 46, .25);
  border-radius: 6px;
  padding: .5rem 1rem;
  font-size: .85rem;
  text-decoration: none;
  transition: background .15s, border-color .15s;
}

.quick-link:hover {
  border-color: var(--folio-accent);
  background: rgba(19, 27, 46, .2);
}

.page-header {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1.25rem;
  margin-bottom: 1.5rem;
  display: flex;
}

.folio-layout .page-title, .folio-layout .mq-title, .folio-layout .leases-title, .folio-layout .vendors-title, .folio-layout .le-title, .folio-layout .insp-title, .folio-layout .asset-title {
  font-size: var(--folio-text-page, 1.875rem);
  font-weight: var(--folio-text-page-weight, 500);
  letter-spacing: -.025em;
  color: var(--on-surface);
  margin: 0;
  line-height: 1.15;
}

.page-subtitle {
  font-size: var(--folio-text-subtitle, .875rem);
  color: var(--on-surface-variant);
  margin-top: .25rem;
}

.page-actions {
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  display: flex;
}

.folio-layout .btn, .folio-layout .insp-btn {
  font-size: var(--folio-text-btn, .8125rem);
  font-weight: var(--folio-text-btn-weight, 600);
  cursor: pointer;
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  transition: transform .12s var(--ease-out, cubic-bezier(.23, 1, .32, 1)),
    opacity .15s ease,
    box-shadow .15s ease;
  border: none;
  border-radius: .375rem;
  justify-content: center;
  align-items: center;
  gap: .4rem;
  padding: .625rem 1rem;
  font-family: inherit;
  text-decoration: none;
  display: inline-flex;
}

.folio-layout .btn-sm {
  padding: .35rem .7rem;
}

.folio-layout .btn-primary, .folio-layout .insp-btn--primary {
  color: #fff;
  background-image: linear-gradient(135deg, #000 0%, var(--navy) 100%);
  box-shadow: 0 1px 2px rgba(25, 28, 30, .08);
}

.folio-layout .btn-ghost, .folio-layout .insp-btn--ghost {
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  border: 1px solid rgba(198, 198, 205, .45);
}

.folio-layout .btn:active, .folio-layout .insp-btn:active {
  transform: scale(.97);
}

.folio-layout .btn:disabled, .folio-layout .insp-btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.folio-layout .main-area {
  max-width: 72rem;
}

.stat-grid {
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 1rem;
  display: grid;
}

.stat-card {
  background: var(--folio-surface);
  border: 1px solid var(--folio-border);
  border-radius: var(--folio-radius);
  align-items: center;
  gap: 1rem;
  padding: 1.25rem;
  display: flex;
}

.stat-icon {
  font-size: 1.75rem;
}

.stat-label {
  color: var(--folio-muted);
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: .75rem;
}

.stat-value {
  margin-top: .2rem;
  font-size: 1.5rem;
  font-weight: 700;
}

.login-page {
  background: var(--folio-bg);
  place-items: center;
  min-height: 100vh;
  display: grid;
}

.login-card {
  background: var(--folio-surface);
  border: 1px solid var(--folio-border);
  border-radius: var(--folio-radius);
  flex-direction: column;
  gap: 1.5rem;
  width: 100%;
  max-width: 400px;
  padding: 2.5rem 2rem;
  display: flex;
}

.login-logo {
  text-align: center;
}

.logo-text {
  color: var(--folio-accent2);
  font-size: 1.75rem;
  font-weight: 800;
  display: block;
}

.logo-sub {
  color: var(--folio-muted);
  font-size: .8rem;
}

.login-form {
  flex-direction: column;
  gap: .75rem;
  display: flex;
}

.login-label {
  color: var(--folio-muted);
  font-size: .85rem;
}

.login-input {
  background: var(--folio-bg);
  border: 1px solid var(--folio-border);
  width: 100%;
  color: var(--folio-text);
  border-radius: 6px;
  outline: none;
  padding: .65rem .85rem;
  font-size: .9rem;
  transition: border-color .15s;
}

.login-input:focus {
  border-color: var(--folio-accent);
}

.login-btn {
  background: var(--folio-accent);
  color: #fff;
  cursor: pointer;
  border: none;
  border-radius: 6px;
  margin-top: .5rem;
  padding: .7rem;
  font-size: .9rem;
  font-weight: 600;
  transition: opacity .15s;
}

.login-btn:disabled {
  opacity: .6;
  cursor: default;
}

.login-btn:hover:not(:disabled) {
  opacity: .9;
}

.login-error {
  color: #f87171;
  font-size: .8rem;
}

.login-sent {
  text-align: center;
  color: var(--folio-text);
}

.page-placeholder {
  background: var(--folio-surface);
  border: 1px dashed var(--folio-border);
  border-radius: var(--folio-radius);
  text-align: center;
  color: var(--folio-muted);
  padding: 3rem;
}

.loading-screen {
  height: 100vh;
  color: var(--folio-muted);
  place-items: center;
  display: grid;
}

.verify-page {
  place-items: center;
  height: 100vh;
  display: grid;
}

.verify-msg {
  color: var(--folio-muted);
}

.verify-error {
  text-align: center;
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.error-detail {
  color: var(--folio-muted);
  font-size: .8rem;
}

.not-found {
  text-align: center;
  place-items: center;
  gap: 1rem;
  height: 100vh;
  display: grid;
}

.asset-detail-page {
  max-width: 72rem;
  padding: 1.5rem 2rem;
}

.asset-detail-page--loading {
  opacity: .6;
  pointer-events: none;
}

.asset-detail-body {
  flex-direction: column;
  gap: 1.5rem;
  display: flex;
}

@media (width >= 1024px) {
  .asset-detail-body {
    flex-direction: row;
    align-items: flex-start;
  }
}

.asset-detail-main {
  flex-direction: column;
  flex: 1;
  gap: 1.25rem;
  min-width: 0;
  display: flex;
}

.asset-detail-sidebar {
  flex-direction: column;
  gap: 1rem;
  width: 100%;
  display: flex;
}

@media (width >= 1024px) {
  .asset-detail-sidebar {
    flex-shrink: 0;
    width: 18rem;
  }
}

.asset-breadcrumb {
  color: var(--folio-muted);
  flex-wrap: wrap;
  align-items: center;
  gap: .25rem;
  margin-bottom: 1.25rem;
  font-size: .75rem;
  display: flex;
}

.asset-breadcrumb__link {
  color: var(--folio-muted);
  align-items: center;
  gap: .25rem;
  text-decoration: none;
  transition: color .15s;
  display: flex;
}

.asset-breadcrumb__link:hover {
  color: var(--folio-text);
}

.asset-breadcrumb__icon {
  font-size: 14px !important;
}

.asset-breadcrumb__sep {
  color: var(--folio-muted);
  font-size: 13px !important;
}

.asset-breadcrumb__current {
  color: var(--folio-text);
  font-weight: 600;
}

.asset-detail-card {
  background: var(--folio-surface);
  border: 1px solid var(--folio-border);
  border-radius: var(--folio-radius);
  padding: 1.25rem;
}

.asset-header-card {
  align-items: flex-start;
  gap: 1rem;
  display: flex;
}

.asset-type-icon-wrap {
  background: rgba(19, 27, 46, .12);
  border-radius: .75rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 3.5rem;
  height: 3.5rem;
  display: flex;
}

.asset-type-icon {
  color: var(--folio-accent2);
  font-size: 28px !important;
}

.asset-header-info {
  flex: 1;
  min-width: 0;
}

.asset-title {
  margin-bottom: .5rem;
}

.asset-header-pills {
  flex-wrap: wrap;
  gap: .4rem;
  margin-bottom: .5rem;
  display: flex;
}

.asset-type-pill {
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--folio-accent2);
  background: rgba(19, 27, 46, .12);
  border: 1px solid rgba(19, 27, 46, .25);
  border-radius: .25rem;
  align-items: center;
  padding: .125rem .5rem;
  font-size: .65rem;
  font-weight: 700;
  display: inline-flex;
}

.asset-status-pill {
  text-transform: uppercase;
  letter-spacing: .04em;
  border-radius: .25rem;
  align-items: center;
  padding: .125rem .5rem;
  font-size: .65rem;
  font-weight: 700;
  display: inline-flex;
}

.asset-status-pill--active {
  color: var(--green);
  background: rgba(104, 219, 169, .15);
  border: 1px solid rgba(133, 248, 196, .3);
}

.asset-status-pill--inactive {
  color: var(--folio-muted);
  background: rgba(198, 198, 205, .2);
  border: 1px solid rgba(198, 198, 205, .3);
}

.asset-status-pill--pending {
  color: #d97706;
  background: rgba(247, 147, 26, .12);
  border: 1px solid rgba(247, 147, 26, .3);
}

.asset-status-pill--archived, .asset-status-pill--unknown {
  color: var(--folio-muted);
  background: rgba(198, 198, 205, .2);
  border: 1px solid rgba(198, 198, 205, .3);
}

.asset-header-address {
  color: var(--folio-muted);
  align-items: center;
  gap: .25rem;
  font-size: .75rem;
  display: flex;
}

.asset-header-address-icon {
  font-size: 13px !important;
}

.asset-section-header {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
  display: flex;
}

.asset-section-label {
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--folio-muted);
  margin-bottom: .75rem;
  font-size: .6rem;
  font-weight: 700;
}

.asset-section-header .asset-section-label {
  margin-bottom: 0;
}

.asset-section-action {
  color: var(--folio-muted);
  align-items: center;
  gap: .25rem;
  font-size: .75rem;
  font-weight: 600;
  text-decoration: none;
  transition: color .15s;
  display: flex;
}

.asset-section-action:hover {
  color: var(--folio-text);
}

.asset-empty-timeline, .asset-empty-inline {
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .5rem;
  padding: 2rem 1rem;
  display: flex;
}

.asset-empty-inline {
  padding: 1rem .5rem;
}

.asset-empty-icon {
  color: var(--folio-muted);
  opacity: .5;
  font-size: 2rem !important;
}

.asset-empty-text {
  color: var(--folio-muted);
  font-size: .85rem;
}

.asset-empty-sub {
  color: var(--folio-muted);
  opacity: .7;
  max-width: 24rem;
  font-size: .75rem;
}

.asset-actions-card .asset-section-label {
  margin-bottom: .75rem;
}

.asset-actions-list {
  flex-direction: column;
  gap: .6rem;
  display: flex;
}

.asset-action-btn {
  cursor: pointer;
  border: none;
  border-radius: .75rem;
  justify-content: center;
  align-items: center;
  gap: .5rem;
  padding: .65rem 1rem;
  font-size: .8rem;
  font-weight: 700;
  text-decoration: none;
  transition: opacity .15s, background .15s;
  display: flex;
}

.asset-action-btn--primary {
  background: var(--folio-accent);
  color: #fff;
}

.asset-action-btn--primary:hover {
  opacity: .88;
}

.asset-action-btn--secondary {
  color: var(--folio-text);
  border: 1px solid var(--folio-border);
  background: none;
}

.asset-action-btn--secondary:hover {
  background: rgba(19, 27, 46, .08);
}

.asset-meta-row {
  border-bottom: 1px solid rgba(42, 45, 58, .5);
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  padding: .45rem 0;
  font-size: .78rem;
  display: flex;
}

.asset-meta-row:last-child {
  border-bottom: none;
}

.asset-meta-key {
  color: var(--folio-muted);
  text-transform: capitalize;
  flex-shrink: 0;
}

.asset-meta-val {
  text-align: right;
  word-break: break-word;
  font-weight: 600;
}

.asset-meta-mono {
  font-family: monospace;
  font-size: .75rem;
}

.asset-meta-empty {
  color: var(--folio-muted);
  text-align: center;
  padding: .75rem 0;
  font-size: .75rem;
}

.asset-vendor-link {
  color: var(--folio-muted);
  align-items: center;
  gap: .375rem;
  margin-top: .75rem;
  font-size: .75rem;
  font-weight: 600;
  text-decoration: none;
  transition: color .15s;
  display: flex;
}

.asset-vendor-link:hover {
  color: var(--folio-text);
}

.asset-skeleton {
  border-radius: var(--folio-radius);
  background: linear-gradient(90deg, var(--folio-surface) 25%, var(--folio-border) 50%, var(--folio-surface) 75%);
  background-size: 200% 100%;
  animation: 1.5s linear infinite asset-shimmer;
}

@keyframes asset-shimmer {
  0% {
    background-position: 200% 0;
  }

  100% {
    background-position: -200% 0;
  }
}

.asset-skeleton--breadcrumb {
  width: 16rem;
  height: 1rem;
  margin-bottom: 1.25rem;
}

.asset-skeleton--header {
  height: 7rem;
  margin-bottom: 0;
}

.asset-skeleton--timeline {
  height: 14rem;
}

.asset-skeleton--card {
  height: 8rem;
}

.asset-detail-error {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: .75rem;
  padding: 4rem 2rem;
  display: flex;
}

.asset-detail-error-icon {
  color: var(--folio-muted);
  font-size: 3rem !important;
}

.asset-detail-error-title {
  font-size: 1.1rem;
  font-weight: 600;
}

.asset-detail-error-body {
  color: var(--folio-muted);
  max-width: 28rem;
  font-size: .85rem;
}

.asset-detail-back-link {
  color: var(--folio-accent2);
  align-items: center;
  gap: .375rem;
  margin-top: .5rem;
  font-size: .85rem;
  font-weight: 600;
  text-decoration: none;
  transition: opacity .15s;
  display: flex;
}

.asset-detail-back-link:hover {
  opacity: .8;
}

.asset-timeline {
  flex-direction: column;
  gap: 0;
  display: flex;
}

.asset-timeline-item {
  gap: .875rem;
  padding-bottom: 1.25rem;
  display: flex;
  position: relative;
}

.asset-timeline-item:before {
  content: "";
  background: var(--folio-border);
  width: 1.5px;
  position: absolute;
  top: 2.25rem;
  bottom: 0;
  left: .9375rem;
}

.asset-timeline-item:last-child:before {
  display: none;
}

.asset-tl-icon {
  border: 2px solid;
  border-radius: 9999px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  margin-top: .125rem;
  display: flex;
}

.asset-tl-icon--complete {
  color: var(--green);
  background: rgba(104, 219, 169, .1);
  border-color: rgba(133, 248, 196, .4);
}

.asset-tl-icon--scheduled {
  background: var(--folio-surface);
  border-color: var(--folio-border);
  color: var(--folio-muted);
}

.asset-tl-icon--cancelled {
  color: var(--error);
  background: rgba(255, 218, 214, .1);
  border-color: rgba(186, 26, 26, .3);
}

.asset-tl-body {
  flex: 1;
  min-width: 0;
}

.asset-tl-header {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: .5rem;
  display: flex;
}

.asset-tl-name {
  font-size: .875rem;
  font-weight: 600;
}

.asset-tl-meta {
  color: var(--folio-muted);
  margin-top: .2rem;
  font-size: .75rem;
}

.asset-timeline-loading {
  border-radius: var(--folio-radius);
  background: linear-gradient(90deg, var(--folio-surface) 25%, var(--folio-border) 50%, var(--folio-surface) 75%);
  background-size: 200% 100%;
  height: 6rem;
  animation: 1.5s linear infinite asset-shimmer;
}

.asset-event-pill {
  text-transform: uppercase;
  letter-spacing: .04em;
  white-space: nowrap;
  border-radius: .25rem;
  flex-shrink: 0;
  align-items: center;
  padding: .1rem .45rem;
  font-size: .6rem;
  font-weight: 700;
  display: inline-flex;
}

.asset-event-pill--complete {
  color: var(--green);
  background: rgba(104, 219, 169, .15);
  border: 1px solid rgba(133, 248, 196, .3);
}

.asset-event-pill--scheduled {
  color: var(--folio-muted);
  background: rgba(198, 198, 205, .2);
  border: 1px solid rgba(198, 198, 205, .3);
}

.asset-event-pill--active {
  color: var(--folio-accent2);
  background: rgba(19, 27, 46, .12);
  border: 1px solid rgba(19, 27, 46, .25);
}

.asset-event-pill--cancelled {
  color: var(--error);
  background: rgba(255, 218, 214, .2);
  border: 1px solid rgba(186, 26, 26, .3);
}

.asset-lifecycle-grid {
  grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr));
  gap: 1rem;
  margin-top: .25rem;
  display: grid;
}

.asset-lifecycle-cell__label {
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--folio-muted);
  margin-bottom: .25rem;
  font-size: .6rem;
  font-weight: 700;
}

.asset-lifecycle-cell__value {
  font-size: .875rem;
  font-weight: 600;
}

.asset-cond-pill--excellent {
  color: var(--green);
  background: rgba(104, 219, 169, .15);
  border: 1px solid rgba(133, 248, 196, .3);
}

.asset-cond-pill--good {
  color: var(--green);
  background: rgba(104, 219, 169, .1);
  border: 1px solid rgba(133, 248, 196, .2);
}

.asset-cond-pill--fair {
  color: #d97706;
  background: rgba(247, 147, 26, .12);
  border: 1px solid rgba(247, 147, 26, .3);
}

.asset-cond-pill--poor {
  color: var(--error);
  background: rgba(255, 218, 214, .2);
  border: 1px solid rgba(186, 26, 26, .3);
}

.asset-cond-pill--retired, .asset-cond-pill--unknown {
  color: var(--folio-muted);
  background: rgba(198, 198, 205, .2);
  border: 1px solid rgba(198, 198, 205, .3);
}

.asset-contractor-card {
  align-items: center;
  gap: .75rem;
  margin-bottom: .75rem;
  display: flex;
}

.asset-contractor-avatar {
  background: var(--folio-accent);
  color: #fff;
  border-radius: 9999px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 2.25rem;
  height: 2.25rem;
  font-size: .875rem;
  font-weight: 700;
  display: flex;
}

.asset-contractor-info {
  flex: 1;
  min-width: 0;
}

.asset-contractor-name {
  margin-bottom: .25rem;
  font-size: .9rem;
  font-weight: 600;
}

.asset-contractor-loading {
  border-radius: var(--folio-radius);
  background: linear-gradient(90deg, var(--folio-surface) 25%, var(--folio-border) 50%, var(--folio-surface) 75%);
  background-size: 200% 100%;
  height: 3.5rem;
  animation: 1.5s linear infinite asset-shimmer;
}

.asset-inline-code {
  color: var(--folio-accent2);
  background: rgba(19, 27, 46, .08);
  border: 1px solid rgba(19, 27, 46, .2);
  border-radius: .25rem;
  padding: .1rem .3rem;
  font-family: monospace;
  font-size: .7rem;
}

.asset-inline-link {
  color: var(--folio-accent2);
  text-underline-offset: 2px;
  text-decoration: underline;
}

.asset-tl-icon--maintenance {
  color: var(--folio-accent2);
  background: rgba(19, 27, 46, .1);
  border-color: rgba(19, 27, 46, .3);
}

.asset-tl-icon--compliance {
  color: #d97706;
  background: rgba(247, 147, 26, .1);
  border-color: rgba(247, 147, 26, .3);
}

.asset-tl-icon--lease {
  color: var(--green);
  background: rgba(104, 219, 169, .1);
  border-color: rgba(133, 248, 196, .3);
}

.asset-tl-icon--event {
  background: var(--folio-surface);
  border-color: var(--folio-border);
  color: var(--folio-muted);
}

.asset-tl-badges {
  flex-shrink: 0;
  align-items: center;
  gap: .3rem;
  display: flex;
}

.asset-timeline-section-label {
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--folio-muted);
  margin-bottom: .5rem;
  font-size: .6rem;
  font-weight: 700;
}

.asset-cost-badge {
  color: var(--green);
  white-space: nowrap;
  background: rgba(104, 219, 169, .12);
  border: 1px solid rgba(133, 248, 196, .3);
  border-radius: .25rem;
  align-items: center;
  padding: .1rem .4rem;
  font-size: .6rem;
  font-weight: 700;
  display: inline-flex;
}

.asset-empty-inline {
  opacity: .7;
  align-items: center;
  gap: .5rem;
  display: flex;
}

.asset-empty-icon--sm {
  font-size: 1rem !important;
}

.asset-empty-text--sm {
  font-size: .8rem;
}

.asset-contractor-remove {
  cursor: pointer;
  color: var(--folio-muted);
  background: none;
  border: none;
  border-radius: .25rem;
  padding: .25rem;
  transition: color .15s, background .15s;
}

.asset-contractor-remove:hover {
  color: var(--error);
  background: rgba(186, 26, 26, .08);
}

.asset-contractor-hint {
  color: var(--folio-muted);
  margin: .1rem 0 .75rem;
  font-size: .72rem;
}

.asset-vendor-selector {
  border-top: 1px solid var(--folio-border);
  flex-direction: column;
  gap: .25rem;
  margin-top: .75rem;
  padding-top: .75rem;
  display: flex;
}

.asset-vendor-selector__label {
  color: var(--folio-muted);
  margin-bottom: .25rem;
  font-size: .7rem;
  font-weight: 600;
}

.asset-vendor-option {
  cursor: pointer;
  text-align: left;
  background: none;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .375rem;
  align-items: center;
  gap: .5rem;
  width: 100%;
  padding: .4rem .5rem;
  transition: background .15s, border-color .15s;
  display: flex;
}

.asset-vendor-option:hover {
  background: var(--folio-surface);
  border-color: var(--folio-border);
}

.asset-vendor-option:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.vendors-page {
  max-width: 72rem;
  margin: 0 auto;
}

.vendors-header {
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1.75rem;
  display: flex;
}

.vendors-title {
  margin-bottom: .25rem;
}

.vendors-subtitle {
  color: var(--folio-muted);
  max-width: 52ch;
  font-size: .85rem;
  line-height: 1.5;
}

.vendors-add-btn {
  background: var(--folio-accent);
  color: #fff;
  white-space: nowrap;
  border-radius: .5rem;
  align-items: center;
  gap: .4rem;
  padding: .5rem 1rem;
  font-size: .8rem;
  font-weight: 600;
  text-decoration: none;
  transition: opacity .15s, transform .1s;
  display: inline-flex;
}

.vendors-add-btn:hover {
  opacity: .9;
  transform: translateY(-1px);
}

.vendors-filter-bar {
  flex-direction: column;
  gap: .75rem;
  margin-bottom: 1.5rem;
  display: flex;
}

.vendors-search-wrap {
  max-width: 360px;
  position: relative;
}

.vendors-search-icon {
  color: var(--folio-muted);
  pointer-events: none;
  font-size: 16px;
  position: absolute;
  top: 50%;
  left: .6rem;
  transform: translateY(-50%);
}

.vendors-search-input {
  border: 1px solid var(--folio-border);
  background: var(--folio-surface);
  width: 100%;
  color: var(--folio-text);
  border-radius: .5rem;
  outline: none;
  padding: .45rem .75rem .45rem 2.1rem;
  font-size: .85rem;
  transition: border-color .15s;
}

.vendors-search-input:focus {
  border-color: var(--folio-accent);
}

.vendors-trade-chips {
  flex-wrap: wrap;
  gap: .4rem;
  display: flex;
}

.vendor-trade-chip {
  border: 1px solid var(--folio-border);
  background: var(--folio-surface);
  color: var(--folio-muted);
  cursor: pointer;
  border-radius: 999px;
  align-items: center;
  gap: .3rem;
  padding: .25rem .65rem;
  font-size: .72rem;
  font-weight: 600;
  transition: all .15s;
  display: inline-flex;
}

.vendor-trade-chip:hover {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
}

.vendor-trade-chip--active {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
}

.vendors-grid {
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 1.25rem;
  display: grid;
}

.vendor-card {
  background: var(--folio-card);
  border: 1px solid var(--folio-border);
  border-radius: .875rem;
  flex-direction: column;
  gap: .85rem;
  padding: 1.25rem;
  transition: box-shadow .2s, border-color .2s;
  display: flex;
}

.vendor-card:hover {
  border-color: var(--folio-accent);
  box-shadow: 0 4px 20px rgba(0, 0, 0, .12);
}

.vendor-card-header {
  align-items: center;
  gap: .75rem;
  display: flex;
}

.vendor-avatar {
  background: linear-gradient(135deg, var(--folio-accent), var(--folio-accent2));
  color: #fff;
  border-radius: .625rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 2.5rem;
  height: 2.5rem;
  font-size: 1rem;
  font-weight: 700;
  display: flex;
}

.vendor-card-identity {
  flex: 1;
  min-width: 0;
}

.vendor-card-name {
  color: var(--folio-text);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .95rem;
  font-weight: 700;
  overflow: hidden;
}

.vendor-card-pills {
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .3rem;
  display: flex;
}

.vendor-trade-pill {
  text-transform: capitalize;
  color: var(--folio-accent2);
  background: rgba(19, 27, 46, .1);
  border: 1px solid rgba(19, 27, 46, .2);
  border-radius: .25rem;
  align-items: center;
  gap: .2rem;
  padding: .1rem .45rem;
  font-size: .68rem;
  font-weight: 600;
  display: inline-flex;
}

.vendor-status-pill {
  text-transform: uppercase;
  letter-spacing: .04em;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .25rem;
  align-items: center;
  padding: .1rem .4rem;
  font-size: .68rem;
  font-weight: 700;
  display: inline-flex;
}

.vendor-status-pill--active {
  color: var(--green);
  background: rgba(104, 219, 169, .12);
  border-color: rgba(133, 248, 196, .3);
}

.vendor-status-pill--inactive {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border-color: var(--folio-border);
}

.vendor-status-pill--suspended {
  color: #d97706;
  background: rgba(247, 147, 26, .1);
  border-color: rgba(247, 147, 26, .3);
}

.vendor-status-pill--pending {
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
  border-color: rgba(19, 27, 46, .2);
}

.vendor-status-pill--unknown {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border-color: var(--folio-border);
}

.vendor-emergency-pill {
  color: var(--error);
  background: rgba(186, 26, 26, .1);
  border: 1px solid rgba(186, 26, 26, .2);
  border-radius: .25rem;
  align-items: center;
  gap: .2rem;
  padding: .1rem .4rem;
  font-size: .68rem;
  font-weight: 700;
  display: inline-flex;
}

.vendor-rating {
  align-items: center;
  gap: .15rem;
  display: flex;
}

.vendor-star {
  font-size: 15px !important;
}

.vendor-star--full, .vendor-star--half {
  color: #f59e0b;
}

.vendor-star--empty {
  color: var(--folio-border);
}

.vendor-rating-value {
  color: var(--folio-muted);
  margin-left: .25rem;
  font-size: .75rem;
  font-weight: 600;
}

.vendor-card-actions {
  gap: .5rem;
  display: flex;
}

.vendor-action-btn {
  cursor: pointer;
  border: 1px solid;
  border-radius: .5rem;
  align-items: center;
  gap: .4rem;
  padding: .4rem .85rem;
  font-size: .78rem;
  font-weight: 600;
  transition: all .15s;
  display: inline-flex;
}

.vendor-action-btn--primary {
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
  border-color: rgba(19, 27, 46, .3);
}

.vendor-action-btn--primary:hover {
  background: rgba(19, 27, 46, .2);
}

.vendor-action-btn--primary:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.vendor-assign-msg {
  border-radius: .375rem;
  align-items: center;
  gap: .35rem;
  padding: .4rem .6rem;
  font-size: .78rem;
  display: flex;
}

.vendor-assign-msg--error {
  color: var(--error);
  background: rgba(186, 26, 26, .08);
  border: 1px solid rgba(186, 26, 26, .2);
}

.vendor-assign-msg--success {
  color: var(--green);
  background: rgba(104, 219, 169, .1);
  border: 1px solid rgba(133, 248, 196, .3);
}

.vendor-asset-picker {
  border-top: 1px solid var(--folio-border);
  flex-direction: column;
  gap: .3rem;
  max-height: 260px;
  padding-top: .875rem;
  display: flex;
  overflow-y: auto;
}

.vendor-asset-picker__label {
  color: var(--folio-muted);
  margin-bottom: .35rem;
  font-size: .7rem;
  font-weight: 600;
}

.vendor-picker-loading {
  color: var(--folio-muted);
  font-size: .8rem;
}

.vendor-asset-option {
  cursor: pointer;
  text-align: left;
  background: none;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .4rem;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: .45rem .6rem;
  transition: background .15s, border-color .15s;
  display: flex;
}

.vendor-asset-option:hover {
  background: var(--folio-surface);
  border-color: var(--folio-border);
}

.vendor-asset-option:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.vendor-asset-option-info {
  align-items: center;
  gap: .5rem;
  display: flex;
}

.vendor-asset-option-name {
  color: var(--folio-text);
  font-size: .82rem;
  font-weight: 600;
}

.vendor-asset-option-meta {
  color: var(--folio-muted);
  text-transform: capitalize;
  font-size: .7rem;
}

.vendors-empty {
  text-align: center;
  color: var(--folio-muted);
  padding: 4rem 2rem;
}

.vendors-empty-icon {
  margin-bottom: .75rem;
  display: block;
  font-size: 3rem !important;
}

.vendors-empty-title {
  color: var(--folio-text);
  margin-bottom: .4rem;
  font-size: 1.1rem;
  font-weight: 700;
}

.vendors-empty-sub {
  max-width: 40ch;
  margin: 0 auto;
  font-size: .85rem;
}

.vendors-error {
  text-align: center;
  color: var(--folio-muted);
  padding: 3rem;
}

.vendors-error-text {
  margin-top: .5rem;
  font-size: .9rem;
}

.vendor-card--skeleton {
  pointer-events: none;
}

.vendor-skeleton {
  background: var(--folio-surface);
  border-radius: .375rem;
  animation: 1.5s ease-in-out infinite vendor-pulse;
}

.vendor-skeleton--avatar {
  border-radius: .625rem;
  width: 2.5rem;
  height: 2.5rem;
}

.vendor-skeleton--name {
  width: 60%;
  height: 1rem;
  margin-top: .5rem;
}

.vendor-skeleton--pills {
  width: 40%;
  height: .7rem;
}

.vendor-skeleton--action {
  border-radius: .5rem;
  width: 100%;
  height: 2rem;
}

@keyframes vendor-pulse {
  0%, 100% {
    opacity: .4;
  }

  50% {
    opacity: .8;
  }
}

.leases-page {
  max-width: 72rem;
  margin: 0 auto;
}

.leases-header {
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1.5rem;
  display: flex;
}

.leases-title {
  margin-bottom: .25rem;
}

.leases-subtitle {
  color: var(--folio-muted);
  font-size: .85rem;
}

.leases-filter-bar {
  flex-direction: column;
  gap: .75rem;
  margin-bottom: 1.25rem;
  display: flex;
}

.leases-search-wrap {
  max-width: 360px;
  position: relative;
}

.leases-search-icon {
  color: var(--folio-muted);
  pointer-events: none;
  font-size: 16px;
  position: absolute;
  top: 50%;
  left: .6rem;
  transform: translateY(-50%);
}

.leases-search-input {
  border: 1px solid var(--folio-border);
  background: var(--folio-surface);
  width: 100%;
  color: var(--folio-text);
  border-radius: .5rem;
  outline: none;
  padding: .45rem .75rem .45rem 2.1rem;
  font-size: .85rem;
  transition: border-color .15s;
}

.leases-search-input:focus {
  border-color: var(--folio-accent);
}

.leases-status-chips {
  flex-wrap: wrap;
  gap: .4rem;
  display: flex;
}

.lease-status-chip {
  border: 1px solid var(--folio-border);
  background: var(--folio-surface);
  color: var(--folio-muted);
  cursor: pointer;
  border-radius: 999px;
  align-items: center;
  gap: .3rem;
  padding: .25rem .65rem;
  font-size: .72rem;
  font-weight: 600;
  transition: all .15s;
  display: inline-flex;
}

.lease-status-chip:hover {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
}

.lease-status-chip--active {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
}

.leases-table-wrap {
  border: 1px solid var(--folio-border);
  border-radius: .75rem;
  overflow: hidden;
}

.leases-table {
  border-collapse: collapse;
  width: 100%;
}

.leases-th {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--folio-muted);
  background: var(--folio-surface);
  text-align: left;
  border-bottom: 1px solid var(--folio-border);
  padding: .6rem 1rem;
  font-size: .72rem;
  font-weight: 700;
}

.leases-row {
  border-bottom: 1px solid var(--folio-border);
  transition: background .1s;
}

.leases-row:last-child {
  border-bottom: none;
}

.leases-row:hover {
  background: rgba(19, 27, 46, .04);
}

.leases-td {
  color: var(--folio-text);
  padding: .75rem 1rem;
  font-size: .82rem;
}

.leases-td--mono {
  color: var(--folio-muted);
  font-family: monospace;
  font-size: .75rem;
}

.leases-td--amount {
  color: var(--folio-text);
  font-weight: 700;
}

.lease-status-badge {
  letter-spacing: .03em;
  text-transform: uppercase;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .25rem;
  align-items: center;
  gap: .25rem;
  padding: .15rem .45rem;
  font-size: .68rem;
  font-weight: 700;
  display: inline-flex;
}

.lease-status--active {
  color: var(--green);
  background: rgba(104, 219, 169, .12);
  border-color: rgba(133, 248, 196, .3);
}

.lease-status--draft {
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
  border-color: rgba(19, 27, 46, .2);
}

.lease-status--pending {
  color: #d97706;
  background: rgba(247, 147, 26, .1);
  border-color: rgba(247, 147, 26, .3);
}

.lease-status--expired {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border-color: var(--folio-border);
}

.lease-status--terminated {
  color: var(--error);
  background: rgba(186, 26, 26, .08);
  border-color: rgba(186, 26, 26, .2);
}

.lease-status--unknown {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border-color: var(--folio-border);
}

.leases-detail-link {
  color: var(--folio-accent);
  align-items: center;
  gap: .2rem;
  font-size: .78rem;
  font-weight: 600;
  text-decoration: none;
  display: inline-flex;
}

.leases-detail-link:hover {
  text-decoration: underline;
}

.leases-empty {
  text-align: center;
  color: var(--folio-muted);
  padding: 4rem 2rem;
}

.leases-empty-icon {
  margin-bottom: .75rem;
  display: block;
  font-size: 3rem !important;
}

.leases-empty-title {
  color: var(--folio-text);
  margin-bottom: .4rem;
  font-size: 1.1rem;
  font-weight: 700;
}

.leases-empty-sub {
  max-width: 40ch;
  margin: 0 auto;
  font-size: .85rem;
}

.leases-error {
  text-align: center;
  color: var(--folio-muted);
  padding: 3rem;
}

.leases-error-text {
  margin-top: .5rem;
  font-size: .9rem;
}

.leases-skel {
  background: var(--folio-surface);
  border-radius: .25rem;
  animation: 1.5s ease-in-out infinite lease-pulse;
}

.leases-skel--badge {
  width: 4.5rem;
  height: 1.25rem;
}

.leases-skel--text {
  width: 80%;
  height: .85rem;
}

.leases-skel--link {
  width: 2.5rem;
  height: .85rem;
}

@keyframes lease-pulse {
  0%, 100% {
    opacity: .4;
  }

  50% {
    opacity: .8;
  }
}

.ld-page {
  max-width: 1280px;
  margin: 0 auto;
  padding: 2rem;
}

.ld-back-link {
  color: var(--folio-muted);
  align-items: center;
  gap: .35rem;
  margin-bottom: 1.25rem;
  font-size: .8rem;
  font-weight: 600;
  text-decoration: none;
  transition: color .15s;
  display: inline-flex;
}

.ld-back-link:hover {
  color: var(--folio-accent);
}

.ld-header {
  background: var(--folio-card);
  border: 1px solid var(--folio-border);
  border-radius: .875rem;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1.5rem;
  margin-bottom: 1.5rem;
  padding: 1.5rem;
  display: flex;
}

.ld-header-left {
  align-items: center;
  gap: 1rem;
  display: flex;
}

.ld-avatar {
  background: linear-gradient(135deg, var(--folio-accent), var(--folio-accent2));
  color: #fff;
  border-radius: .75rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 3rem;
  height: 3rem;
  display: flex;
}

.ld-title {
  color: var(--folio-text);
  font-size: 1.3rem;
  font-weight: 800;
}

.ld-title-id {
  font-family: monospace;
  font-size: 1rem;
  font-weight: 700;
}

.ld-header-title-row {
  align-items: center;
  gap: .6rem;
  margin-bottom: .25rem;
  display: flex;
}

.ld-subtitle {
  color: var(--folio-muted);
  text-transform: capitalize;
  font-size: .8rem;
}

.ld-header-kpis {
  flex-wrap: wrap;
  gap: 1.5rem;
  display: flex;
}

.ld-kpi {
  flex-direction: column;
  gap: .15rem;
  display: flex;
}

.ld-kpi-label {
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--folio-muted);
  font-size: .65rem;
  font-weight: 700;
}

.ld-kpi-value {
  color: var(--folio-text);
  font-size: 1.1rem;
  font-weight: 800;
}

.ld-kpi-value--sm {
  text-transform: capitalize;
  font-size: .85rem;
  font-weight: 600;
}

.ld-kpi-sub {
  color: var(--folio-muted);
  align-items: center;
  gap: .15rem;
  font-size: .68rem;
  display: flex;
}

.ld-kpi-sub--green {
  color: var(--green);
}

.ld-termination-banner {
  color: var(--error);
  background: rgba(186, 26, 26, .08);
  border: 1px solid rgba(186, 26, 26, .2);
  border-radius: .5rem;
  align-items: center;
  gap: .5rem;
  margin-bottom: 1.25rem;
  padding: .6rem 1rem;
  font-size: .82rem;
  font-weight: 600;
  display: flex;
}

.ld-body {
  grid-template-columns: 1fr 340px;
  gap: 1.25rem;
  display: grid;
}

@media (width <= 900px) {
  .ld-body {
    grid-template-columns: 1fr;
  }
}

.ld-col-main, .ld-col-side {
  flex-direction: column;
  gap: 1.25rem;
  display: flex;
}

.ld-card {
  background: var(--folio-card);
  border: 1px solid var(--folio-border);
  border-radius: .875rem;
  padding: 1.25rem;
}

.ld-card-title {
  color: var(--folio-text);
  align-items: center;
  gap: .4rem;
  margin-bottom: 1rem;
  font-size: .9rem;
  font-weight: 700;
  display: flex;
}

.ld-card-title-row {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  margin-bottom: .5rem;
  display: flex;
}

.ld-household-hint {
  color: var(--folio-muted);
  margin: 0 0 1rem;
  font-size: .75rem;
  line-height: 1.4;
}

.ld-inv-table {
  border-collapse: collapse;
  width: 100%;
}

.ld-inv-th {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--folio-muted);
  text-align: left;
  border-bottom: 1px solid var(--folio-border);
  padding: .4rem .5rem;
  font-size: .68rem;
  font-weight: 700;
}

.ld-inv-row {
  border-bottom: 1px solid var(--folio-border);
}

.ld-inv-row:last-child {
  border-bottom: none;
}

.ld-inv-td {
  color: var(--folio-text);
  padding: .6rem .5rem;
  font-size: .8rem;
}

.ld-inv-td--amount {
  font-weight: 700;
}

.ld-inv-td--rail {
  color: var(--folio-muted);
  font-size: .72rem;
}

.ld-tenant-edit {
  margin-top: .5rem;
}

.ld-tenant-edit-btn {
  padding: .25rem .6rem;
  font-size: .75rem;
}

.ld-tenant-edit-row {
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  margin-top: .35rem;
  display: flex;
}

.ld-tenant-edit-row .folio-input {
  max-width: 16rem;
}

.inv-status-badge {
  text-transform: uppercase;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .2rem;
  align-items: center;
  gap: .2rem;
  padding: .12rem .4rem;
  font-size: .65rem;
  font-weight: 700;
  display: inline-flex;
}

.inv-status--paid {
  color: var(--green);
  background: rgba(104, 219, 169, .12);
  border-color: rgba(133, 248, 196, .3);
}

.inv-status--pending {
  color: #d97706;
  background: rgba(247, 147, 26, .1);
  border-color: rgba(247, 147, 26, .3);
}

.inv-status--processing {
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
  border-color: rgba(19, 27, 46, .2);
}

.inv-status--failed {
  color: var(--error);
  background: rgba(186, 26, 26, .08);
  border-color: rgba(186, 26, 26, .2);
}

.inv-status--refunded, .inv-status--unknown {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border-color: var(--folio-border);
}

.ld-occupant-list {
  flex-direction: column;
  gap: .5rem;
  list-style: none;
  display: flex;
}

.ld-occupant-list--former {
  margin-top: .5rem;
}

.ld-occupant-row {
  align-items: center;
  gap: .75rem;
  display: flex;
}

.ld-occupant-row--former {
  opacity: .85;
}

.ld-occupant-actions {
  flex-shrink: 0;
  gap: .35rem;
  margin-left: auto;
  display: flex;
}

.ld-former-section {
  border-top: 1px solid var(--folio-border);
  margin-top: 1.25rem;
  padding-top: .75rem;
}

.ld-former-summary {
  cursor: pointer;
  color: var(--folio-muted);
  font-size: .8rem;
  font-weight: 600;
  list-style: none;
}

.ld-former-summary::-webkit-details-marker {
  display: none;
}

.ld-former-badge {
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--folio-muted);
  flex-shrink: 0;
  font-size: .65rem;
  font-weight: 700;
}

.ld-occupant-avatar {
  width: 2rem;
  height: 2rem;
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .15);
  border-radius: .5rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  font-size: .85rem;
  font-weight: 700;
  display: flex;
}

.ld-occupant-avatar--former {
  background: var(--folio-surface);
  color: var(--folio-muted);
}

.ld-occupant-name {
  color: var(--folio-text);
  font-size: .85rem;
  font-weight: 600;
}

.ld-occupant-meta {
  color: var(--folio-muted);
  font-size: .72rem;
}

.ld-vehicle-list {
  flex-direction: column;
  gap: .6rem;
  list-style: none;
  display: flex;
}

.ld-vehicle-row {
  align-items: center;
  gap: .6rem;
  display: flex;
}

.ld-vehicle-info {
  flex: 1;
}

.ld-vehicle-name {
  color: var(--folio-text);
  text-transform: capitalize;
  font-size: .82rem;
  font-weight: 600;
}

.ld-vehicle-plate {
  color: var(--folio-muted);
  font-family: monospace;
  font-size: .72rem;
}

.ld-quick-links {
  flex-direction: column;
  gap: .4rem;
  display: flex;
}

.ld-quick-link {
  color: var(--folio-text);
  border: 1px solid var(--folio-border);
  border-radius: .4rem;
  align-items: center;
  gap: .5rem;
  padding: .5rem .7rem;
  font-size: .82rem;
  font-weight: 600;
  text-decoration: none;
  transition: all .15s;
  display: flex;
}

.ld-quick-link:hover {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .07);
}

.ld-empty-inline {
  color: var(--folio-muted);
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  padding: 1.5rem 0;
  display: flex;
}

.ld-empty-icon {
  font-size: 1.75rem !important;
}

.ld-empty-text {
  text-align: center;
  max-width: 28ch;
  font-size: .82rem;
}

.ld-meta-empty {
  color: var(--folio-muted);
  padding: .5rem 0;
  font-size: .82rem;
}

.ld-header-skeleton {
  background: var(--folio-surface);
  border-radius: .875rem;
  height: 140px;
  margin-bottom: 1.5rem;
  animation: 1.5s ease-in-out infinite lease-pulse;
}

.ld-skel {
  background: var(--folio-surface);
  border-radius: .375rem;
  animation: 1.5s ease-in-out infinite lease-pulse;
}

.ld-skel--table {
  height: 120px;
}

.ld-skel--list {
  height: 80px;
}

.ld-error {
  background: rgba(186, 26, 26, .06);
  border: 1px solid rgba(186, 26, 26, .2);
  border-radius: .5rem;
  padding: 1rem;
}

.ld-error-text {
  color: var(--error);
  font-size: .85rem;
}

.tp-page {
  max-width: 1100px;
  margin: 0 auto;
  padding: 2rem;
}

.tp-back-link {
  color: var(--folio-muted);
  align-items: center;
  gap: .35rem;
  margin-bottom: 1.25rem;
  font-size: .8rem;
  font-weight: 600;
  text-decoration: none;
  transition: color .15s;
  display: inline-flex;
}

.tp-back-link:hover {
  color: var(--folio-accent);
}

.tp-header {
  background: var(--folio-card);
  border: 1px solid var(--folio-border);
  border-radius: .875rem;
  align-items: center;
  gap: 1.25rem;
  margin-bottom: 1.5rem;
  padding: 1.5rem;
  display: flex;
}

.tp-avatar {
  background: linear-gradient(135deg, var(--folio-accent), var(--folio-accent2));
  color: #fff;
  letter-spacing: .02em;
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 3.5rem;
  height: 3.5rem;
  font-size: 1.25rem;
  font-weight: 800;
  display: flex;
}

.tp-name {
  color: var(--folio-text);
  margin-bottom: .35rem;
  font-size: 1.3rem;
  font-weight: 800;
}

.tp-meta-row {
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  display: flex;
}

.tp-meta-item {
  color: var(--folio-muted);
  align-items: center;
  gap: .25rem;
  font-size: .8rem;
  display: flex;
}

.tp-meta-sep {
  color: var(--folio-border);
  font-size: .85rem;
}

.tp-body {
  grid-template-columns: 1fr 280px;
  gap: 1.25rem;
  display: grid;
}

@media (width <= 860px) {
  .tp-body {
    grid-template-columns: 1fr;
  }
}

.tp-col-main, .tp-col-side {
  flex-direction: column;
  gap: 1.25rem;
  display: flex;
}

.tp-card {
  background: var(--folio-card);
  border: 1px solid var(--folio-border);
  border-radius: .875rem;
  padding: 1.25rem;
}

.tp-card-title {
  color: var(--folio-text);
  align-items: center;
  gap: .4rem;
  margin-bottom: 1rem;
  font-size: .9rem;
  font-weight: 700;
  display: flex;
}

.tp-lease-list {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.tp-lease-row {
  border: 1px solid var(--folio-border);
  border-radius: .5rem;
  align-items: center;
  gap: 1rem;
  padding: .6rem .75rem;
  transition: background .1s;
  display: flex;
}

.tp-lease-row:hover {
  background: rgba(19, 27, 46, .04);
}

.tp-lease-status {
  flex-shrink: 0;
}

.tp-lease-details {
  flex-direction: column;
  flex: 1;
  gap: .15rem;
  display: flex;
}

.tp-lease-rent {
  color: var(--folio-text);
  font-size: .85rem;
  font-weight: 700;
}

.tp-lease-period {
  color: var(--folio-muted);
  font-size: .72rem;
}

.tp-lease-link {
  color: var(--folio-accent);
  flex-shrink: 0;
  align-items: center;
  gap: .15rem;
  font-size: .75rem;
  font-weight: 600;
  text-decoration: none;
  display: inline-flex;
}

.tp-lease-link:hover {
  text-decoration: underline;
}

.tp-app-table {
  border-collapse: collapse;
  width: 100%;
}

.tp-app-th {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--folio-muted);
  text-align: left;
  border-bottom: 1px solid var(--folio-border);
  padding: .4rem .5rem;
  font-size: .68rem;
  font-weight: 700;
}

.tp-app-row {
  border-bottom: 1px solid var(--folio-border);
}

.tp-app-row:last-child {
  border-bottom: none;
}

.tp-app-td {
  color: var(--folio-text);
  padding: .55rem .5rem;
  font-size: .8rem;
}

.tp-app-td--mono {
  font-family: monospace;
  font-size: .75rem;
}

.app-status-badge {
  text-transform: uppercase;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .2rem;
  align-items: center;
  gap: .2rem;
  padding: .12rem .4rem;
  font-size: .65rem;
  font-weight: 700;
  display: inline-flex;
}

.app-status--approved {
  color: var(--green);
  background: rgba(104, 219, 169, .12);
  border-color: rgba(133, 248, 196, .3);
}

.app-status--submitted {
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
  border-color: rgba(19, 27, 46, .2);
}

.app-status--pending {
  color: #d97706;
  background: rgba(247, 147, 26, .1);
  border-color: rgba(247, 147, 26, .3);
}

.app-status--denied {
  color: var(--error);
  background: rgba(186, 26, 26, .08);
  border-color: rgba(186, 26, 26, .2);
}

.app-status--withdrawn, .app-status--unknown {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border-color: var(--folio-border);
}

.screening-badge {
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .2rem;
  padding: .1rem .35rem;
  font-size: .65rem;
  font-weight: 700;
  display: inline-block;
}

.screening--passed {
  color: var(--green);
  background: rgba(104, 219, 169, .12);
  border-color: rgba(133, 248, 196, .3);
}

.screening--failed {
  color: var(--error);
  background: rgba(186, 26, 26, .08);
  border-color: rgba(186, 26, 26, .2);
}

.screening--pending {
  color: #d97706;
  background: rgba(247, 147, 26, .1);
  border-color: rgba(247, 147, 26, .3);
}

.screening--na {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border-color: var(--folio-border);
}

.tp-quick-links {
  flex-direction: column;
  gap: .4rem;
  display: flex;
}

.tp-quick-link {
  color: var(--folio-text);
  border: 1px solid var(--folio-border);
  border-radius: .4rem;
  align-items: center;
  gap: .5rem;
  padding: .5rem .7rem;
  font-size: .82rem;
  font-weight: 600;
  text-decoration: none;
  transition: all .15s;
  display: flex;
}

.tp-quick-link:hover {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .07);
}

.tp-error {
  color: var(--folio-muted);
  text-align: center;
  flex-direction: column;
  align-items: center;
  padding: 3rem;
  display: flex;
}

.tp-error-text {
  margin-top: .5rem;
  font-size: .9rem;
}

.tp-header-skeleton {
  background: var(--folio-surface);
  border-radius: .875rem;
  height: 100px;
  margin-bottom: 1.5rem;
  animation: 1.5s ease-in-out infinite lease-pulse;
}

.tp-skel {
  background: var(--folio-surface);
  border-radius: .375rem;
  animation: 1.5s ease-in-out infinite lease-pulse;
}

.tp-skel--table {
  height: 110px;
}

.tp-empty-inline {
  color: var(--folio-muted);
  flex-direction: column;
  align-items: center;
  gap: .4rem;
  padding: 1.5rem 0;
  display: flex;
}

.tp-empty-icon {
  font-size: 1.75rem !important;
}

.tp-empty-text {
  text-align: center;
  max-width: 28ch;
  font-size: .82rem;
}

.mq-page {
  max-width: 72rem;
  margin: 0 auto;
}

.mq-header {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1.5rem;
  display: flex;
}

.mq-title {
  margin-bottom: .25rem;
}

.mq-subtitle {
  color: var(--folio-muted);
  font-size: .85rem;
}

.mq-kpi-strip {
  flex-wrap: wrap;
  gap: 1rem;
  display: flex;
}

.mq-kpi {
  background: var(--folio-card);
  border: 1px solid var(--folio-border);
  border-radius: .5rem;
  align-items: center;
  gap: .4rem;
  padding: .45rem .8rem;
  display: flex;
}

.mq-kpi--emergency {
  color: var(--error);
  background: rgba(186, 26, 26, .06);
  border-color: rgba(186, 26, 26, .3);
}

.mq-kpi-val {
  color: var(--folio-text);
  font-size: 1.1rem;
  font-weight: 800;
}

.mq-kpi--emergency .mq-kpi-val {
  color: var(--error);
}

.mq-kpi-label {
  color: var(--folio-muted);
  font-size: .72rem;
  font-weight: 600;
}

.mq-kpi-skel {
  background: var(--folio-surface);
  border-radius: .5rem;
  width: 100px;
  height: 40px;
  animation: 1.5s infinite lease-pulse;
}

.mq-filter-bar {
  flex-direction: column;
  gap: .75rem;
  margin-bottom: 1.25rem;
  display: flex;
}

.mq-search-wrap {
  max-width: 380px;
  position: relative;
}

.mq-search-icon {
  color: var(--folio-muted);
  pointer-events: none;
  font-size: 16px;
  position: absolute;
  top: 50%;
  left: .65rem;
  transform: translateY(-50%);
}

.mq-search-input {
  border: 1px solid var(--folio-border);
  background: var(--folio-surface);
  width: 100%;
  color: var(--folio-text);
  border-radius: .5rem;
  outline: none;
  padding: .45rem .75rem .45rem 2.2rem;
  font-size: .85rem;
  transition: border-color .15s;
}

.mq-search-input:focus {
  border-color: var(--folio-accent);
}

.mq-category-chips {
  flex-wrap: wrap;
  gap: .35rem;
  display: flex;
}

.mq-cat-chip {
  border: 1px solid var(--folio-border);
  background: var(--folio-surface);
  color: var(--folio-muted);
  cursor: pointer;
  border-radius: 999px;
  align-items: center;
  gap: .3rem;
  padding: .25rem .6rem;
  font-size: .72rem;
  font-weight: 600;
  transition: all .15s;
  display: inline-flex;
}

.mq-cat-chip:hover {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
}

.mq-cat-chip--active {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
}

.mq-priority-chips {
  flex-wrap: wrap;
  gap: .35rem;
  display: flex;
}

.mq-priority-chip {
  border: 1px solid var(--folio-border);
  background: var(--folio-surface);
  color: var(--folio-muted);
  cursor: pointer;
  border-radius: 999px;
  align-items: center;
  gap: .3rem;
  padding: .2rem .55rem;
  font-size: .7rem;
  font-weight: 600;
  transition: all .15s;
  display: inline-flex;
}

.mq-priority-chip:hover {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
}

.mq-priority-chip--active {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
}

.mq-table-wrap {
  border: 1px solid var(--folio-border);
  border-radius: .75rem;
  display: none;
  overflow: hidden;
}

@media (width >= 768px) {
  .mq-table-wrap {
    display: block;
  }
}

.mq-feed-cards {
  flex-direction: column;
  gap: 0;
  display: flex;
}

@media (width >= 768px) {
  .mq-feed-cards {
    display: none;
  }
}

.mq-table {
  border-collapse: collapse;
  width: 100%;
}

.mq-table th {
  z-index: 1;
  background: var(--surface-container-lowest);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--outline);
  text-align: left;
  border-bottom: 1px solid color-mix(in srgb, var(--outline-variant) 45%, transparent);
  padding: .65rem 1rem;
  font-size: .62rem;
  font-weight: 800;
  position: sticky;
  top: 0;
}

.mq-table td {
  border-bottom: 1px solid color-mix(in srgb, var(--outline-variant) 25%, transparent);
  vertical-align: middle;
  padding: .8rem 1rem;
}

.mq-th {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--folio-muted);
  background: var(--folio-surface);
  text-align: left;
  border-bottom: 1px solid var(--folio-border);
  padding: .6rem 1rem;
  font-size: .72rem;
  font-weight: 700;
}

.mq-row {
  border-bottom: 1px solid var(--folio-border);
  transition: background .1s;
}

.mq-row:last-child {
  border-bottom: none;
}

.mq-row:hover {
  background: rgba(19, 27, 46, .04);
}

.mq-row--emergency {
  background: rgba(186, 26, 26, .04);
}

.mq-row--emergency:hover {
  background: rgba(186, 26, 26, .08);
}

.mq-td {
  color: var(--folio-text);
  padding: .75rem 1rem;
  font-size: .82rem;
}

.mq-td--subject {
  max-width: 340px;
  font-weight: 600;
}

.mq-td--mono {
  color: var(--folio-muted);
  font-family: monospace;
  font-size: .75rem;
}

.mq-td--cost {
  font-weight: 700;
}

.mq-priority-badge {
  text-transform: uppercase;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .25rem;
  align-items: center;
  gap: .2rem;
  padding: .15rem .45rem;
  font-size: .68rem;
  font-weight: 700;
  display: inline-flex;
}

.mq-priority--emergency {
  color: var(--error);
  background: rgba(186, 26, 26, .1);
  border-color: rgba(186, 26, 26, .25);
}

.mq-priority--routine, .mq-priority--unknown {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border-color: var(--folio-border);
}

.mq-status-badge {
  text-transform: uppercase;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .25rem;
  align-items: center;
  gap: .2rem;
  padding: .15rem .45rem;
  font-size: .68rem;
  font-weight: 700;
  display: inline-flex;
}

.mq-status--open {
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
  border-color: rgba(19, 27, 46, .2);
}

.mq-status--in-progress {
  color: #d97706;
  background: rgba(247, 147, 26, .1);
  border-color: rgba(247, 147, 26, .3);
}

.mq-status--resolved {
  color: var(--green);
  background: rgba(104, 219, 169, .12);
  border-color: rgba(133, 248, 196, .3);
}

.mq-status--closed {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border-color: var(--folio-border);
}

.mq-status--scheduled {
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
  border-color: rgba(19, 27, 46, .2);
}

.mq-status--completed {
  color: var(--green);
  background: rgba(104, 219, 169, .12);
  border-color: rgba(133, 248, 196, .3);
}

.mq-status--unknown {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border-color: var(--folio-border);
}

.mq-skel {
  background: var(--folio-surface);
  border-radius: .25rem;
  animation: 1.5s infinite lease-pulse;
}

.mq-skel--badge {
  width: 5rem;
  height: 1.2rem;
}

.mq-skel--text {
  width: 75%;
  height: .85rem;
}

.mq-skel--sm {
  width: 3.5rem;
  height: .85rem;
}

.mq-empty {
  text-align: center;
  color: var(--folio-muted);
  padding: 4rem 2rem;
}

.mq-empty-icon {
  margin-bottom: .75rem;
  display: block;
  font-size: 3rem !important;
}

.mq-empty-title {
  color: var(--folio-text);
  margin-bottom: .4rem;
  font-size: 1.1rem;
  font-weight: 700;
}

.mq-empty-sub {
  max-width: 40ch;
  margin: 0 auto;
  font-size: .85rem;
}

.mq-error {
  text-align: center;
  padding: 2rem;
}

.mq-error-text {
  color: var(--error);
  font-size: .9rem;
}

.le-page {
  max-width: 72rem;
  margin: 0 auto;
}

.le-header {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1.5rem;
  display: flex;
}

.le-title {
  margin-bottom: .25rem;
}

.le-subtitle {
  color: var(--folio-muted);
  font-size: .85rem;
}

.le-kpi-strip {
  flex-wrap: wrap;
  gap: 1.25rem;
  display: flex;
}

.le-kpi {
  background: var(--folio-card);
  border: 1px solid var(--folio-border);
  border-radius: .5rem;
  flex-direction: column;
  gap: .15rem;
  padding: .6rem 1rem;
  display: flex;
}

.le-kpi-label {
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--folio-muted);
  font-size: .65rem;
  font-weight: 700;
}

.le-kpi-val {
  color: var(--folio-text);
  font-size: 1.15rem;
  font-weight: 800;
}

.le-kpi-val--alert {
  color: #d97706;
}

.le-kpi-val--green {
  color: var(--green);
}

.le-kpi-skel {
  background: var(--folio-surface);
  border-radius: .5rem;
  width: 160px;
  height: 56px;
  animation: 1.5s infinite lease-pulse;
}

.le-filter-bar {
  flex-direction: column;
  gap: .75rem;
  margin-bottom: 1.25rem;
  display: flex;
}

.le-search-wrap {
  max-width: 380px;
  position: relative;
}

.le-search-icon {
  color: var(--folio-muted);
  pointer-events: none;
  font-size: 16px;
  position: absolute;
  top: 50%;
  left: .65rem;
  transform: translateY(-50%);
}

.le-search-input {
  border: 1px solid var(--folio-border);
  background: var(--folio-surface);
  width: 100%;
  color: var(--folio-text);
  border-radius: .5rem;
  outline: none;
  padding: .45rem .75rem .45rem 2.2rem;
  font-size: .85rem;
  transition: border-color .15s;
}

.le-search-input:focus {
  border-color: var(--folio-accent);
}

.le-status-chips {
  flex-wrap: wrap;
  gap: .35rem;
  display: flex;
}

.le-chip {
  border: 1px solid var(--folio-border);
  background: var(--folio-surface);
  color: var(--folio-muted);
  cursor: pointer;
  border-radius: 999px;
  align-items: center;
  gap: .25rem;
  padding: .25rem .65rem;
  font-size: .72rem;
  font-weight: 600;
  transition: all .15s;
  display: inline-flex;
}

.le-chip:hover {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
}

.le-chip--active {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
}

.le-type-chips {
  flex-wrap: wrap;
  gap: .3rem;
  display: flex;
}

.le-type-chip {
  border: 1px solid var(--folio-border);
  background: var(--folio-surface);
  color: var(--folio-muted);
  cursor: pointer;
  border-radius: 999px;
  align-items: center;
  gap: .25rem;
  padding: .2rem .55rem;
  font-size: .68rem;
  font-weight: 600;
  transition: all .15s;
  display: inline-flex;
}

.le-type-chip:hover {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
}

.le-type-chip--active {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
}

.le-table-wrap {
  border: 1px solid var(--folio-border);
  border-radius: .75rem;
  overflow: auto hidden;
}

.le-table {
  border-collapse: collapse;
  width: 100%;
  min-width: 900px;
}

.le-th {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--folio-muted);
  background: var(--folio-surface);
  text-align: left;
  border-bottom: 1px solid var(--folio-border);
  white-space: nowrap;
  padding: .6rem .85rem;
  font-size: .68rem;
  font-weight: 700;
}

.le-row {
  border-bottom: 1px solid var(--folio-border);
  transition: background .1s;
}

.le-row:last-child {
  border-bottom: none;
}

.le-row:hover {
  background: rgba(19, 27, 46, .04);
}

.le-row--outstanding {
  border-left: 3px solid #d97706;
}

.le-td {
  color: var(--folio-text);
  vertical-align: middle;
  padding: .65rem .85rem;
  font-size: .8rem;
}

.le-td--desc {
  max-width: 260px;
  font-weight: 600;
}

.le-td--mono {
  color: var(--folio-muted);
  font-family: monospace;
  font-size: .72rem;
}

.le-td--amount {
  white-space: nowrap;
  font-weight: 700;
}

.le-td--net {
  color: var(--green);
  white-space: nowrap;
  font-weight: 600;
}

.le-td--rail {
  color: var(--folio-muted);
  text-transform: capitalize;
  font-size: .72rem;
}

.le-status-badge {
  text-transform: uppercase;
  white-space: nowrap;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .25rem;
  align-items: center;
  gap: .2rem;
  padding: .13rem .4rem;
  font-size: .65rem;
  font-weight: 700;
  display: inline-flex;
}

.le-status--pending {
  color: #d97706;
  background: rgba(247, 147, 26, .1);
  border-color: rgba(247, 147, 26, .3);
}

.le-status--processing {
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
  border-color: rgba(19, 27, 46, .2);
}

.le-status--paid {
  color: var(--green);
  background: rgba(104, 219, 169, .12);
  border-color: rgba(133, 248, 196, .3);
}

.le-status--failed {
  color: var(--error);
  background: rgba(186, 26, 26, .08);
  border-color: rgba(186, 26, 26, .2);
}

.le-status--refunded, .le-status--waived, .le-status--unknown {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border-color: var(--folio-border);
}

.le-charge-badge {
  white-space: nowrap;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .25rem;
  align-items: center;
  gap: .2rem;
  padding: .13rem .4rem;
  font-size: .65rem;
  font-weight: 700;
  display: inline-flex;
}

.ct--rent {
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
  border-color: rgba(19, 27, 46, .2);
}

.ct--late-fee {
  color: var(--error);
  background: rgba(186, 26, 26, .08);
  border-color: rgba(186, 26, 26, .2);
}

.ct--maintenance {
  color: #d97706;
  background: rgba(247, 147, 26, .08);
  border-color: rgba(247, 147, 26, .25);
}

.ct--incidental {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border-color: var(--folio-border);
}

.ct--deposit {
  color: var(--green);
  background: rgba(104, 219, 169, .1);
  border-color: rgba(133, 248, 196, .25);
}

.ct--utility {
  color: #0284c7;
  background: rgba(56, 189, 248, .08);
  border-color: rgba(56, 189, 248, .2);
}

.ct--booking {
  color: #7c3aed;
  background: rgba(168, 85, 247, .08);
  border-color: rgba(168, 85, 247, .2);
}

.ct--violation {
  color: var(--error);
  background: rgba(186, 26, 26, .08);
  border-color: rgba(186, 26, 26, .2);
}

.ct--other {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border-color: var(--folio-border);
}

.le-skel {
  background: var(--folio-surface);
  border-radius: .25rem;
  animation: 1.5s infinite lease-pulse;
}

.le-skel--badge {
  width: 5rem;
  height: 1.2rem;
}

.le-skel--text {
  width: 80%;
  height: .85rem;
}

.le-skel--sm {
  width: 4rem;
  height: .85rem;
}

.le-empty {
  text-align: center;
  padding: 4rem 2rem;
}

.le-empty-icon {
  color: var(--folio-muted);
  margin-bottom: .75rem;
  display: block;
  font-size: 3rem !important;
}

.le-empty-title {
  color: var(--folio-text);
  margin-bottom: .4rem;
  font-size: 1.1rem;
  font-weight: 700;
}

.le-empty-sub {
  color: var(--folio-muted);
  max-width: 38ch;
  margin: 0 auto;
  font-size: .85rem;
}

.le-error {
  text-align: center;
  padding: 2rem;
}

.le-error-text {
  color: var(--error);
  font-size: .9rem;
}

.viol-page {
  max-width: 1280px;
  margin: 0 auto;
  padding: 2rem;
}

.viol-header {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1.5rem;
  display: flex;
}

.viol-title {
  color: var(--folio-text);
  margin-bottom: .25rem;
  font-size: 1.6rem;
  font-weight: 700;
}

.viol-subtitle {
  color: var(--folio-muted);
  font-size: .85rem;
}

.viol-kpi-strip {
  flex-wrap: wrap;
  gap: 1rem;
  display: flex;
}

.viol-kpi {
  background: var(--folio-card);
  border: 1px solid var(--folio-border);
  border-radius: .5rem;
  align-items: center;
  gap: .4rem;
  padding: .45rem .8rem;
  display: flex;
}

.viol-kpi--escalated {
  color: var(--error);
  background: rgba(186, 26, 26, .06);
  border-color: rgba(186, 26, 26, .3);
}

.viol-kpi-val {
  color: var(--folio-text);
  font-size: 1.1rem;
  font-weight: 800;
}

.viol-kpi--escalated .viol-kpi-val {
  color: var(--error);
}

.viol-kpi-label {
  color: var(--folio-muted);
  font-size: .7rem;
  font-weight: 600;
}

.viol-kpi-skel {
  background: var(--folio-surface);
  border-radius: .5rem;
  width: 100px;
  height: 40px;
  animation: 1.5s infinite lease-pulse;
}

.viol-filter-bar {
  flex-direction: column;
  gap: .75rem;
  margin-bottom: 1.25rem;
  display: flex;
}

.viol-search-wrap {
  max-width: 380px;
  position: relative;
}

.viol-search-icon {
  color: var(--folio-muted);
  pointer-events: none;
  font-size: 16px;
  position: absolute;
  top: 50%;
  left: .65rem;
  transform: translateY(-50%);
}

.viol-search-input {
  border: 1px solid var(--folio-border);
  background: var(--folio-surface);
  width: 100%;
  color: var(--folio-text);
  border-radius: .5rem;
  outline: none;
  padding: .45rem .75rem .45rem 2.2rem;
  font-size: .85rem;
  transition: border-color .15s;
}

.viol-search-input:focus {
  border-color: var(--folio-accent);
}

.viol-status-chips {
  flex-wrap: wrap;
  gap: .35rem;
  display: flex;
}

.viol-chip {
  border: 1px solid var(--folio-border);
  background: var(--folio-surface);
  color: var(--folio-muted);
  cursor: pointer;
  border-radius: 999px;
  align-items: center;
  gap: .25rem;
  padding: .25rem .65rem;
  font-size: .72rem;
  font-weight: 600;
  transition: all .15s;
  display: inline-flex;
}

.viol-chip:hover {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
}

.viol-chip--active {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
}

.viol-table-wrap {
  border: 1px solid var(--folio-border);
  border-radius: .75rem;
  overflow: auto hidden;
}

.viol-table {
  border-collapse: collapse;
  width: 100%;
  min-width: 780px;
}

.viol-th {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--folio-muted);
  background: var(--folio-surface);
  text-align: left;
  border-bottom: 1px solid var(--folio-border);
  white-space: nowrap;
  padding: .6rem 1rem;
  font-size: .68rem;
  font-weight: 700;
}

.viol-row {
  border-bottom: 1px solid var(--folio-border);
  transition: background .1s;
}

.viol-row:last-child {
  border-bottom: none;
}

.viol-row:hover {
  background: rgba(19, 27, 46, .04);
}

.viol-row--escalated {
  border-left: 3px solid var(--error);
  background: rgba(186, 26, 26, .03);
}

.viol-td {
  color: var(--folio-text);
  vertical-align: middle;
  padding: .7rem 1rem;
  font-size: .82rem;
}

.viol-td--subject {
  max-width: 300px;
  font-weight: 600;
}

.viol-td--mono {
  color: var(--folio-muted);
  font-family: monospace;
  font-size: .72rem;
}

.viol-td--deadline {
  white-space: nowrap;
  font-weight: 600;
}

.viol-status-badge {
  text-transform: uppercase;
  white-space: nowrap;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .25rem;
  align-items: center;
  gap: .2rem;
  padding: .13rem .4rem;
  font-size: .65rem;
  font-weight: 700;
  display: inline-flex;
}

.vs--open {
  color: #d97706;
  background: rgba(247, 147, 26, .1);
  border-color: rgba(247, 147, 26, .3);
}

.vs--cured {
  color: var(--green);
  background: rgba(104, 219, 169, .12);
  border-color: rgba(133, 248, 196, .3);
}

.vs--escalated {
  color: var(--error);
  background: rgba(186, 26, 26, .1);
  border-color: rgba(186, 26, 26, .25);
}

.vs--dismissed, .vs--unknown {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border-color: var(--folio-border);
}

.viol-cat-badge {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border: 1px solid var(--folio-border);
  white-space: nowrap;
  border-radius: .25rem;
  align-items: center;
  gap: .25rem;
  padding: .1rem .35rem;
  font-size: .68rem;
  font-weight: 600;
  display: inline-flex;
}

.viol-kind-badge {
  text-transform: uppercase;
  border-radius: .2rem;
  padding: .1rem .4rem;
  font-size: .65rem;
  font-weight: 800;
  display: inline-flex;
}

.viol-kind--ltr {
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
  border: 1px solid rgba(19, 27, 46, .2);
}

.viol-kind--str {
  color: #7c3aed;
  background: rgba(168, 85, 247, .08);
  border: 1px solid rgba(168, 85, 247, .2);
}

.viol-skel {
  background: var(--folio-surface);
  border-radius: .25rem;
  animation: 1.5s infinite lease-pulse;
}

.viol-skel--badge {
  width: 5rem;
  height: 1.2rem;
}

.viol-skel--text {
  width: 70%;
  height: .85rem;
}

.viol-skel--sm {
  width: 4rem;
  height: .85rem;
}

.viol-empty-icon {
  color: var(--folio-muted);
  margin-bottom: .75rem;
  display: block;
  font-size: 3rem !important;
}

.viol-empty-title {
  color: var(--folio-text);
  margin-bottom: .4rem;
  font-size: 1.1rem;
  font-weight: 700;
}

.viol-empty-sub {
  color: var(--folio-muted);
  max-width: 40ch;
  margin: 0 auto;
  font-size: .85rem;
}

.viol-error {
  text-align: center;
  padding: 2rem;
}

.viol-error-text {
  color: var(--error);
  font-size: .9rem;
}

.vp-page {
  max-width: 800px;
  margin: 0 auto;
  padding: 2rem;
}

@media (width >= 768px) {
  .vp-page {
    max-width: 72rem;
  }
}

.vp-header {
  border-bottom: 1px solid var(--folio-border);
  margin-bottom: 2rem;
  padding-bottom: 1rem;
}

.vp-title {
  color: var(--folio-text);
  margin-bottom: .5rem;
  font-size: 1.8rem;
  font-weight: 700;
}

.vp-subtitle {
  color: var(--folio-muted);
  font-size: .95rem;
}

.vp-form {
  flex-direction: column;
  gap: 2rem;
  display: flex;
}

.vp-section {
  background: var(--folio-card);
  border: 1px solid var(--folio-border);
  border-radius: .75rem;
  flex-direction: column;
  gap: 1.25rem;
  padding: 1.5rem;
  display: flex;
}

.vp-section-title {
  color: var(--folio-text);
  border-bottom: 1px solid var(--folio-border);
  margin-bottom: .5rem;
  padding-bottom: .5rem;
  font-size: 1.1rem;
  font-weight: 600;
}

.vp-field {
  flex-direction: column;
  gap: .4rem;
  display: flex;
}

.vp-field-row {
  align-items: center;
  gap: 2rem;
  display: flex;
}

.vp-label {
  color: var(--folio-text);
  font-size: .85rem;
  font-weight: 600;
}

.vp-input, .vp-textarea, .vp-select {
  border: 1px solid var(--folio-border);
  background: var(--folio-surface);
  color: var(--folio-text);
  border-radius: .375rem;
  outline: none;
  padding: .6rem .8rem;
  font-size: .9rem;
  transition: border-color .15s ease-in-out;
}

.vp-input:focus, .vp-textarea:focus, .vp-select:focus {
  border-color: var(--folio-accent);
}

.vp-input--mono {
  font-family: monospace;
}

.vp-checkbox-label {
  cursor: pointer;
  color: var(--folio-text);
  align-items: center;
  gap: .5rem;
  font-size: .9rem;
  display: flex;
}

.vp-checkbox-label--large {
  align-items: flex-start;
  gap: .75rem;
}

.vp-checkbox {
  width: 1rem;
  height: 1rem;
  accent-color: var(--folio-accent);
  border-radius: .25rem;
  margin-top: .2rem;
}

.vp-checkbox-heading {
  font-weight: 600;
  display: block;
}

.vp-checkbox-sub {
  color: var(--folio-muted);
  font-size: .8rem;
  display: block;
}

.vp-field-helper {
  color: var(--folio-muted);
  align-self: flex-end;
  font-size: .75rem;
}

.vp-trades-grid {
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: .5rem;
  display: grid;
}

.vp-trade-btn {
  background: var(--folio-surface);
  border: 1px solid var(--folio-border);
  color: var(--folio-text);
  cursor: pointer;
  text-align: center;
  border-radius: .375rem;
  padding: .5rem;
  font-size: .8rem;
  font-weight: 500;
  transition: all .15s;
}

.vp-trade-btn:hover {
  border-color: var(--folio-accent);
  color: var(--folio-accent);
}

.vp-trade-btn--active {
  background: var(--folio-accent);
  border-color: var(--folio-accent);
  color: #fff;
}

.vp-submit-btn {
  background: var(--folio-accent);
  color: #fff;
  cursor: pointer;
  border: none;
  border-radius: .375rem;
  align-self: flex-end;
  padding: .75rem 1.5rem;
  font-weight: 600;
  transition: opacity .15s;
}

.vp-submit-btn:hover {
  opacity: .9;
}

.vp-submit-btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.vp-alert {
  border-radius: .375rem;
  align-items: center;
  gap: .5rem;
  padding: .75rem 1rem;
  font-size: .9rem;
  display: flex;
}

.vp-alert--success {
  color: var(--green);
  background: rgba(104, 219, 169, .12);
  border: 1px solid rgba(104, 219, 169, .3);
}

.vp-alert--error {
  color: var(--error);
  background: rgba(186, 26, 26, .08);
  border: 1px solid rgba(186, 26, 26, .2);
}

.vp-field-fade {
  animation: .25s ease-out vpFadeIn;
}

@keyframes vpFadeIn {
  from {
    opacity: 0;
    transform: translateY(-5px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.vsch-page {
  max-width: 1200px;
  margin: 0 auto;
  padding: 2rem;
}

.vsch-header {
  border-bottom: 1px solid var(--folio-border);
  margin-bottom: 2rem;
  padding-bottom: 1rem;
}

.vsch-title {
  color: var(--folio-text);
  margin-bottom: .5rem;
  font-size: 1.8rem;
  font-weight: 700;
}

.vsch-subtitle {
  color: var(--folio-muted);
  font-size: .95rem;
}

.vsch-content {
  grid-template-columns: 1fr 380px;
  align-items: start;
  gap: 2rem;
  display: grid;
}

@media (width <= 900px) {
  .vsch-content {
    grid-template-columns: 1fr;
  }
}

.vsch-timeline {
  flex-direction: column;
  gap: 1rem;
  display: flex;
}

.vsch-card {
  background: var(--folio-card);
  border: 1px solid var(--folio-border);
  cursor: pointer;
  border-radius: .75rem;
  padding: 1.25rem;
  transition: transform .15s, border-color .15s;
}

.vsch-card:hover {
  border-color: var(--folio-accent);
  transform: translateY(-2px);
}

.vsch-card-header {
  color: var(--folio-muted);
  justify-content: space-between;
  margin-bottom: .5rem;
  font-size: .8rem;
  font-weight: 600;
  display: flex;
}

.vsch-subject {
  color: var(--folio-text);
  margin-bottom: .75rem;
  font-size: 1.1rem;
  font-weight: 600;
}

.vsch-meta-row {
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  display: flex;
}

.vsch-meta-item {
  color: var(--folio-muted);
  align-items: center;
  gap: .25rem;
  font-size: .85rem;
  display: inline-flex;
}

.vsch-priority {
  text-transform: uppercase;
  border-radius: .25rem;
  padding: .15rem .45rem;
  font-size: .75rem;
  font-weight: 700;
}

.vsch-priority--emergency {
  color: var(--error);
  background: rgba(186, 26, 26, .1);
}

.vsch-priority--routine {
  background: var(--folio-surface);
  color: var(--folio-muted);
  border: 1px solid var(--folio-border);
}

.vsch-status {
  text-transform: uppercase;
  border-radius: .25rem;
  padding: .15rem .45rem;
  font-size: .75rem;
  font-weight: 700;
}

.vsch-status--open {
  color: var(--folio-accent);
  background: rgba(19, 27, 46, .1);
}

.vsch-status--progress {
  color: #d97706;
  background: rgba(247, 147, 26, .1);
}

.vsch-drawer {
  background: var(--folio-card);
  border: 1px solid var(--folio-border);
  border-radius: .75rem;
  flex-direction: column;
  gap: 1.25rem;
  padding: 1.5rem;
  animation: .2s ease-out vschSlideIn;
  display: flex;
  position: sticky;
  top: 2rem;
}

@keyframes vschSlideIn {
  from {
    opacity: 0;
    transform: translateX(15px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.vsch-drawer-header {
  border-bottom: 1px solid var(--folio-border);
  justify-content: space-between;
  align-items: center;
  padding-bottom: .75rem;
  display: flex;
}

.vsch-drawer-title {
  color: var(--folio-text);
  font-size: 1.2rem;
  font-weight: 600;
}

.vsch-drawer-close {
  color: var(--folio-muted);
  cursor: pointer;
  background: none;
  border: none;
}

.vsch-drawer-close:hover {
  color: var(--folio-text);
}

.vsch-drawer-body {
  flex-direction: column;
  gap: 1.25rem;
  display: flex;
}

.vsch-drawer-section {
  flex-direction: column;
  gap: .25rem;
  display: flex;
}

.vsch-drawer-label {
  text-transform: uppercase;
  color: var(--folio-muted);
  font-size: .75rem;
  font-weight: 600;
}

.vsch-drawer-value {
  color: var(--folio-text);
  font-size: .95rem;
}

.vsch-drawer-value--bold {
  font-weight: 600;
}

.vsch-drawer-value--mono {
  word-break: break-all;
  font-family: monospace;
  font-size: .85rem;
}

.vp-loading-skeleton, .vsch-loading-skeleton {
  background: var(--folio-card);
  border: 1px solid var(--folio-border);
  border-radius: .75rem;
  height: 250px;
  animation: 1.5s infinite lease-pulse;
}

.vsch-empty-state {
  text-align: center;
  background: var(--folio-card);
  border: 1px solid var(--folio-border);
  border-radius: .75rem;
  padding: 4rem 2rem;
}

.vsch-empty-icon {
  color: var(--folio-muted);
  margin-bottom: 1rem;
  font-size: 3rem !important;
}

.vsch-empty-title {
  color: var(--folio-text);
  margin-bottom: .5rem;
  font-size: 1.2rem;
  font-weight: 700;
}

.vsch-empty-sub {
  color: var(--folio-muted);
  font-size: .9rem;
}

.insp-page {
  flex-direction: column;
  gap: 1.5rem;
  max-width: 72rem;
  margin: 0 auto;
  display: flex;
}

.insp-header {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  display: flex;
}

.insp-header-left {
  flex-direction: column;
  gap: .25rem;
  display: flex;
}

.insp-title {
  margin: 0;
}

.insp-subtitle {
  font-size: var(--folio-text-subtitle, .875rem);
  color: var(--color-text-tertiary, var(--on-surface-variant));
  margin: 0;
}

.insp-btn .material-symbols-outlined {
  font-size: 18px;
  line-height: 1;
}

.insp-kpi-strip {
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  display: grid;
}

@media (width <= 900px) {
  .insp-kpi-strip {
    grid-template-columns: repeat(2, 1fr);
  }
}

.insp-kpi-strip--loading {
  min-height: 90px;
}

.insp-kpi-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  align-items: center;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  display: flex;
}

.insp-kpi-card--overdue {
  border-color: var(--color-error-border, #f87171);
}

.insp-kpi-card--completed {
  border-color: var(--color-success-border, #4ade80);
}

.insp-kpi-icon {
  color: var(--color-brand);
  opacity: .85;
  font-size: 1.75rem;
}

.insp-kpi-card--overdue .insp-kpi-icon {
  color: #f87171;
}

.insp-kpi-card--completed .insp-kpi-icon {
  color: #4ade80;
}

.insp-kpi-body {
  flex-direction: column;
  display: flex;
}

.insp-kpi-value {
  color: var(--color-text-primary);
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
}

.insp-kpi-label {
  color: var(--color-text-tertiary);
  margin-top: .2rem;
  font-size: .75rem;
}

.insp-kpi-skel {
  border-radius: var(--radius-lg);
  background: var(--color-skeleton-base, rgba(255, 255, 255, .06));
  height: 90px;
  animation: 1.4s ease-in-out infinite pulse;
}

.insp-filter-bar {
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  display: flex;
}

.insp-search-wrap {
  flex: 1;
  min-width: 200px;
  position: relative;
}

.insp-search-icon {
  color: var(--color-text-tertiary);
  pointer-events: none;
  font-size: 1.1rem;
  position: absolute;
  top: 50%;
  left: .75rem;
  transform: translateY(-50%);
}

.insp-search-input {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  width: 100%;
  color: var(--color-text-primary);
  box-sizing: border-box;
  outline: none;
  padding: .6rem .75rem .6rem 2.25rem;
  font-size: .875rem;
  transition: border-color .15s;
}

.insp-search-input:focus {
  border-color: var(--color-brand);
}

.insp-chips {
  flex-wrap: wrap;
  gap: .5rem;
  display: flex;
}

.insp-chip {
  cursor: pointer;
  border: 1px solid var(--color-border);
  color: var(--color-text-secondary);
  background: none;
  border-radius: 999px;
  padding: .4rem 1rem;
  font-size: .8rem;
  font-weight: 500;
  transition: all .15s;
}

.insp-chip:hover {
  background: var(--color-surface-raised);
}

.insp-chip--active {
  background: var(--color-brand);
  border-color: var(--color-brand);
  color: #fff;
}

.insp-table-wrap {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.insp-table {
  border-collapse: collapse;
  width: 100%;
}

.insp-th {
  text-align: left;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--color-text-tertiary);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-surface);
  padding: .75rem 1rem;
  font-size: .75rem;
  font-weight: 600;
}

.insp-th--right {
  text-align: right;
}

.insp-th--center {
  text-align: center;
}

.insp-table-row {
  border-bottom: 1px solid var(--color-border);
  transition: background .12s;
}

.insp-table-row:last-child {
  border-bottom: none;
}

.insp-table-row:hover {
  background: var(--color-surface-hover, rgba(255, 255, 255, .03));
}

.insp-table-cell {
  color: var(--color-text-primary);
  vertical-align: middle;
  padding: .875rem 1rem;
  font-size: .875rem;
}

.insp-td-asset {
  color: var(--color-text-secondary);
}

.insp-td-cost {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.insp-td-actions {
  text-align: center;
}

.insp-date-primary {
  font-weight: 500;
  display: block;
}

.insp-date-sub {
  color: var(--color-text-tertiary);
  margin-top: .1rem;
  font-size: .75rem;
  display: block;
}

.insp-subject {
  font-weight: 500;
}

.insp-asset-label {
  font-size: .8125rem;
}

.insp-badge {
  border-radius: 999px;
  align-items: center;
  padding: .25rem .625rem;
  font-size: .75rem;
  font-weight: 600;
  display: inline-flex;
}

.insp-badge--scheduled {
  color: var(--primary);
  background: rgba(19, 27, 46, .15);
}

.insp-badge--overdue {
  color: #f87171;
  background: rgba(239, 68, 68, .15);
}

.insp-badge--completed {
  color: #4ade80;
  background: rgba(34, 197, 94, .15);
}

.insp-badge--cancelled {
  color: #94a3b8;
  background: rgba(100, 116, 139, .15);
}

.insp-action-btn {
  cursor: pointer;
  border: none;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  transition: background .15s;
  display: inline-flex;
}

.insp-action-btn .material-symbols-outlined {
  font-size: 1.1rem;
}

.insp-action-btn--complete {
  color: #4ade80;
  background: rgba(34, 197, 94, .12);
}

.insp-action-btn--complete:hover {
  background: rgba(34, 197, 94, .25);
}

.insp-action-done {
  color: var(--color-text-tertiary);
  font-size: 1.25rem;
}

.insp-skeleton-wrap {
  flex-direction: column;
  gap: 0;
  display: flex;
}

.insp-skeleton-row {
  border-bottom: 1px solid var(--color-border);
  grid-template-columns: 120px 1fr 140px 100px 100px 80px 60px;
  align-items: center;
  gap: .75rem;
  padding: .875rem 1rem;
  display: grid;
}

.insp-skeleton-row:last-child {
  border-bottom: none;
}

.insp-skel {
  background: var(--color-skeleton-base, rgba(255, 255, 255, .06));
  border-radius: 4px;
  height: 1rem;
  animation: 1.4s ease-in-out infinite pulse;
}

.insp-skel--date {
  width: 80px;
}

.insp-skel--subject {
  width: 100%;
}

.insp-skel--asset {
  width: 110px;
}

.insp-skel--badge {
  width: 70px;
}

.insp-skel--cost {
  width: 50px;
}

.insp-skel--action {
  width: 32px;
  margin: 0 auto;
}

.insp-empty {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: .75rem;
  padding: 4rem 2rem;
  display: flex;
}

.insp-empty-icon {
  color: var(--color-text-tertiary);
  font-size: 3rem;
}

.insp-empty-title {
  color: var(--color-text-primary);
  margin: 0;
  font-size: 1.125rem;
  font-weight: 600;
}

.insp-empty-sub {
  color: var(--color-text-tertiary);
  margin: 0;
  font-size: .875rem;
}

.insp-error {
  text-align: center;
  color: var(--color-error, #f87171);
  flex-direction: column;
  align-items: center;
  gap: .75rem;
  padding: 3rem 2rem;
  display: flex;
}

.insp-error .material-symbols-outlined {
  font-size: 2.5rem;
}

.insp-error p {
  color: var(--color-text-secondary);
  margin: 0;
}

.insp-modal-backdrop {
  backdrop-filter: blur(4px);
  z-index: 1000;
  background: rgba(0, 0, 0, .6);
  justify-content: center;
  align-items: center;
  animation: .15s insp-fade-in;
  display: flex;
  position: fixed;
  inset: 0;
}

@keyframes insp-fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.insp-modal {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  width: 100%;
  max-width: 520px;
  max-height: 90vh;
  animation: .2s insp-slide-up;
  overflow-y: auto;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .5);
}

@keyframes insp-slide-up {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.insp-modal-header {
  border-bottom: 1px solid var(--color-border);
  justify-content: space-between;
  align-items: center;
  padding: 1.25rem 1.5rem;
  display: flex;
}

.insp-modal-header h3 {
  color: var(--color-text-primary);
  margin: 0;
  font-size: 1.125rem;
  font-weight: 700;
}

.insp-modal-close {
  width: 2rem;
  height: 2rem;
  color: var(--color-text-tertiary);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  transition: background .12s;
  display: flex;
}

.insp-modal-close:hover {
  background: var(--color-surface-hover, rgba(255, 255, 255, .06));
}

.insp-modal-body {
  flex-direction: column;
  gap: .75rem;
  padding: 1.25rem 1.5rem;
  display: flex;
}

.insp-modal-footer {
  border-top: 1px solid var(--color-border);
  justify-content: flex-end;
  gap: .75rem;
  padding: 1rem 1.5rem;
  display: flex;
}

.insp-form-label {
  color: var(--color-text-secondary);
  margin-bottom: .2rem;
  font-size: .8125rem;
  font-weight: 600;
}

.insp-form-input, .insp-form-textarea {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  width: 100%;
  color: var(--color-text-primary);
  box-sizing: border-box;
  outline: none;
  padding: .6rem .875rem;
  font-family: inherit;
  font-size: .875rem;
  transition: border-color .15s;
}

.insp-form-input:focus, .insp-form-textarea:focus {
  border-color: var(--color-brand);
}

.insp-form-textarea {
  resize: vertical;
  min-height: 100px;
}

.insp-form-error {
  color: var(--color-error, #f87171);
  margin: 0;
  font-size: .8125rem;
}

.bsys-page {
  flex-direction: column;
  gap: 1.5rem;
  max-width: 1400px;
  margin: 0 auto;
  padding: 2rem 2.5rem;
  display: flex;
}

.bsys-header {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  display: flex;
}

.bsys-header-left {
  flex-direction: column;
  gap: .25rem;
  display: flex;
}

.bsys-title {
  color: var(--color-text-primary);
  margin: 0;
  font-size: 1.75rem;
  font-weight: 700;
}

.bsys-subtitle {
  color: var(--color-text-tertiary);
  margin: 0;
  font-size: .875rem;
}

.bsys-btn {
  border-radius: var(--radius-md);
  cursor: pointer;
  border: none;
  align-items: center;
  gap: .4rem;
  padding: .6rem 1.25rem;
  font-size: .875rem;
  font-weight: 600;
  transition: background .15s, opacity .15s;
  display: inline-flex;
}

.bsys-btn--ghost {
  border: 1px solid var(--color-border);
  color: var(--color-text-secondary);
  background: none;
}

.bsys-btn--ghost:hover {
  background: var(--color-surface-raised);
}

.bsys-kpi-strip {
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  display: grid;
}

@media (width <= 900px) {
  .bsys-kpi-strip {
    grid-template-columns: repeat(2, 1fr);
  }
}

.bsys-kpi-strip--loading {
  min-height: 90px;
}

.bsys-kpi-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  align-items: center;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  display: flex;
}

.bsys-kpi-card--overdue {
  border-color: rgba(239, 68, 68, .5);
}

.bsys-kpi-card--due-soon {
  border-color: rgba(251, 146, 60, .5);
}

.bsys-kpi-card--cert {
  border-color: rgba(19, 27, 46, .4);
}

.bsys-kpi-icon {
  color: var(--color-brand);
  opacity: .85;
  font-size: 1.75rem;
}

.bsys-kpi-card--overdue .bsys-kpi-icon {
  color: #f87171;
}

.bsys-kpi-card--due-soon .bsys-kpi-icon {
  color: #fb923c;
}

.bsys-kpi-card--cert .bsys-kpi-icon {
  color: var(--primary);
}

.bsys-kpi-body {
  flex-direction: column;
  display: flex;
}

.bsys-kpi-value {
  color: var(--color-text-primary);
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
}

.bsys-kpi-label {
  color: var(--color-text-tertiary);
  margin-top: .2rem;
  font-size: .75rem;
}

.bsys-kpi-skel {
  border-radius: var(--radius-lg);
  background: var(--color-skeleton-base, rgba(255, 255, 255, .06));
  height: 90px;
  animation: 1.4s ease-in-out infinite pulse;
}

.bsys-filter-bar {
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  display: flex;
}

.bsys-search-wrap {
  flex: 1;
  min-width: 200px;
  position: relative;
}

.bsys-search-icon {
  color: var(--color-text-tertiary);
  pointer-events: none;
  font-size: 1.1rem;
  position: absolute;
  top: 50%;
  left: .75rem;
  transform: translateY(-50%);
}

.bsys-search-input {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  width: 100%;
  color: var(--color-text-primary);
  box-sizing: border-box;
  outline: none;
  padding: .6rem .75rem .6rem 2.25rem;
  font-size: .875rem;
  transition: border-color .15s;
}

.bsys-search-input:focus {
  border-color: var(--color-brand);
}

.bsys-chips {
  flex-wrap: wrap;
  gap: .4rem;
  display: flex;
}

.bsys-chip {
  cursor: pointer;
  border: 1px solid var(--color-border);
  color: var(--color-text-secondary);
  background: none;
  border-radius: 999px;
  padding: .35rem .875rem;
  font-size: .8rem;
  font-weight: 500;
  transition: all .15s;
}

.bsys-chip:hover {
  background: var(--color-surface-raised);
}

.bsys-chip--active {
  background: var(--color-brand);
  border-color: var(--color-brand);
  color: #fff;
}

.bsys-grid {
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 1.25rem;
  display: grid;
}

.bsys-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  flex-direction: column;
  gap: 1rem;
  padding: 1.25rem;
  transition: border-color .15s, box-shadow .15s;
  display: flex;
}

.bsys-card:hover {
  border-color: var(--color-brand-muted, rgba(19, 27, 46, .4));
  box-shadow: 0 4px 16px rgba(0, 0, 0, .2);
}

.bsys-card--overdue {
  background: rgba(239, 68, 68, .04);
  border-color: rgba(239, 68, 68, .5);
}

.bsys-card--due-soon {
  background: rgba(251, 146, 60, .04);
  border-color: rgba(251, 146, 60, .4);
}

.bsys-card--unknown {
  border-color: var(--color-border);
  opacity: .85;
}

.bsys-card-header {
  align-items: flex-start;
  gap: .75rem;
  display: flex;
}

.bsys-card-icon {
  color: var(--color-brand);
  flex-shrink: 0;
  margin-top: .1rem;
  font-size: 1.5rem;
}

.bsys-card--overdue .bsys-card-icon {
  color: #f87171;
}

.bsys-card--due-soon .bsys-card-icon {
  color: #fb923c;
}

.bsys-card-title-wrap {
  flex-direction: column;
  flex: 1;
  gap: .15rem;
  min-width: 0;
  display: flex;
}

.bsys-card-name {
  color: var(--color-text-primary);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 1rem;
  font-weight: 600;
  overflow: hidden;
}

.bsys-card-type {
  color: var(--color-text-tertiary);
  font-size: .75rem;
}

.bsys-badge {
  white-space: nowrap;
  border-radius: 999px;
  flex-shrink: 0;
  padding: .2rem .6rem;
  font-size: .7rem;
  font-weight: 700;
}

.bsys-badge--overdue {
  color: #f87171;
  background: rgba(239, 68, 68, .2);
}

.bsys-badge--due-soon {
  color: #fb923c;
  background: rgba(251, 146, 60, .2);
}

.bsys-badge--ok {
  color: #4ade80;
  background: rgba(34, 197, 94, .15);
}

.bsys-badge--unknown {
  color: #94a3b8;
  background: rgba(100, 116, 139, .15);
}

.bsys-card-meta {
  background: var(--color-surface, rgba(0, 0, 0, .15));
  border-radius: var(--radius-md);
  flex-direction: column;
  gap: .4rem;
  padding: .75rem;
  display: flex;
}

.bsys-meta-row {
  align-items: center;
  gap: .5rem;
  display: flex;
}

.bsys-meta-icon {
  color: var(--color-text-tertiary);
  flex-shrink: 0;
  font-size: .9rem;
}

.bsys-meta-val {
  color: var(--color-text-secondary);
  font-size: .8125rem;
}

.bsys-cond {
  border-radius: 4px;
  padding: .1rem .5rem;
  font-size: .8125rem;
  font-weight: 600;
}

.bsys-cond--good {
  color: #4ade80;
  background: rgba(34, 197, 94, .15);
}

.bsys-cond--fair {
  color: #fb923c;
  background: rgba(251, 146, 60, .15);
}

.bsys-cond--poor {
  color: #f87171;
  background: rgba(239, 68, 68, .15);
}

.bsys-cond--critical {
  color: #ef4444;
  background: rgba(239, 68, 68, .3);
  font-weight: 800;
}

.bsys-cond--unknown {
  color: #94a3b8;
  background: rgba(100, 116, 139, .15);
}

.bsys-card-dates {
  align-items: flex-start;
  gap: 1rem;
  display: flex;
}

.bsys-date-item {
  flex-direction: column;
  flex: 1;
  gap: .15rem;
  display: flex;
}

.bsys-date-label {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--color-text-tertiary);
  font-size: .7rem;
  font-weight: 600;
}

.bsys-date-val {
  color: var(--color-text-primary);
  font-size: .875rem;
  font-weight: 500;
}

.bsys-date-sub {
  color: var(--color-text-tertiary);
  font-size: .75rem;
}

.bsys-date-divider {
  background: var(--color-border);
  align-self: stretch;
  width: 1px;
  margin-top: .25rem;
}

.bsys-schedule {
  flex-direction: column;
  gap: .4rem;
  margin-top: .75rem;
  display: flex;
}

.bsys-schedule-row {
  flex-direction: column;
  gap: .4rem;
  display: flex;
}

@media (width >= 768px) {
  .bsys-schedule-row {
    flex-direction: row;
    align-items: center;
  }

  .bsys-schedule-row .folio-input {
    flex: 1;
    min-width: 0;
  }
}

.bsys-card-skel {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  flex-direction: column;
  gap: .875rem;
  padding: 1.25rem;
  display: flex;
}

.bsys-skel {
  background: var(--color-skeleton-base, rgba(255, 255, 255, .06));
  border-radius: 4px;
  animation: 1.4s ease-in-out infinite pulse;
}

.bsys-skel--icon {
  border-radius: 50%;
  width: 2rem;
  height: 2rem;
}

.bsys-skel--title {
  width: 65%;
  height: 1rem;
}

.bsys-skel--sub {
  width: 40%;
  height: .75rem;
}

.bsys-skel--date {
  width: 55%;
  height: .75rem;
}

.bsys-empty {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: .75rem;
  padding: 5rem 2rem;
  display: flex;
}

.bsys-empty-icon {
  color: var(--color-text-tertiary);
  font-size: 3rem;
}

.bsys-empty-title {
  color: var(--color-text-primary);
  margin: 0;
  font-size: 1.125rem;
  font-weight: 600;
}

.bsys-empty-sub {
  color: var(--color-text-tertiary);
  margin: 0;
  font-size: .875rem;
}

.bsys-error {
  text-align: center;
  color: var(--color-error, #f87171);
  flex-direction: column;
  align-items: center;
  gap: .75rem;
  padding: 4rem 2rem;
  display: flex;
}

.bsys-error .material-symbols-outlined {
  font-size: 2.5rem;
}

.bsys-error p {
  color: var(--color-text-secondary);
  margin: 0;
}

.appl-page {
  flex-direction: column;
  gap: 1.5rem;
  max-width: 1400px;
  margin: 0 auto;
  padding: 2rem 2.5rem;
  display: flex;
}

.appl-header {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  display: flex;
}

.appl-header-left {
  flex-direction: column;
  gap: .25rem;
  display: flex;
}

.appl-title {
  color: var(--color-text-primary);
  margin: 0;
  font-size: 1.75rem;
  font-weight: 700;
}

.appl-subtitle {
  color: var(--color-text-tertiary);
  margin: 0;
  font-size: .875rem;
}

.appl-btn {
  border-radius: var(--radius-md);
  cursor: pointer;
  border: none;
  align-items: center;
  gap: .4rem;
  padding: .6rem 1.25rem;
  font-size: .875rem;
  font-weight: 600;
  transition: background .15s, opacity .15s;
  display: inline-flex;
}

.appl-btn--ghost {
  border: 1px solid var(--color-border);
  color: var(--color-text-secondary);
  background: none;
}

.appl-btn--ghost:hover {
  background: var(--color-surface-raised);
}

.appl-kpi-strip {
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  display: grid;
}

@media (width <= 900px) {
  .appl-kpi-strip {
    grid-template-columns: repeat(2, 1fr);
  }
}

.appl-kpi-strip--loading {
  min-height: 90px;
}

.appl-kpi-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  align-items: center;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  display: flex;
}

.appl-kpi-card--overdue {
  border-color: rgba(239, 68, 68, .5);
}

.appl-kpi-card--due-soon {
  border-color: rgba(251, 146, 60, .5);
}

.appl-kpi-card--warranty {
  border-color: rgba(19, 27, 46, .4);
}

.appl-kpi-icon {
  color: var(--color-brand);
  opacity: .85;
  font-size: 1.75rem;
}

.appl-kpi-card--overdue .appl-kpi-icon {
  color: #f87171;
}

.appl-kpi-card--due-soon .appl-kpi-icon {
  color: #fb923c;
}

.appl-kpi-card--warranty .appl-kpi-icon {
  color: var(--primary);
}

.appl-kpi-body {
  flex-direction: column;
  display: flex;
}

.appl-kpi-value {
  color: var(--color-text-primary);
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
}

.appl-kpi-label {
  color: var(--color-text-tertiary);
  margin-top: .2rem;
  font-size: .75rem;
}

.appl-kpi-skel {
  border-radius: var(--radius-lg);
  background: var(--color-skeleton-base, rgba(255, 255, 255, .06));
  height: 90px;
  animation: 1.4s ease-in-out infinite pulse;
}

.appl-filter-bar {
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  display: flex;
}

.appl-search-wrap {
  flex: 1;
  min-width: 200px;
  position: relative;
}

.appl-search-icon {
  color: var(--color-text-tertiary);
  pointer-events: none;
  font-size: 1.1rem;
  position: absolute;
  top: 50%;
  left: .75rem;
  transform: translateY(-50%);
}

.appl-search-input {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  width: 100%;
  color: var(--color-text-primary);
  box-sizing: border-box;
  outline: none;
  padding: .6rem .75rem .6rem 2.25rem;
  font-size: .875rem;
  transition: border-color .15s;
}

.appl-search-input:focus {
  border-color: var(--color-brand);
}

.appl-chips {
  flex-wrap: wrap;
  gap: .4rem;
  display: flex;
}

.appl-chip {
  cursor: pointer;
  border: 1px solid var(--color-border);
  color: var(--color-text-secondary);
  background: none;
  border-radius: 999px;
  padding: .35rem .875rem;
  font-size: .8rem;
  font-weight: 500;
  transition: all .15s;
}

.appl-chip:hover {
  background: var(--color-surface-raised);
}

.appl-chip--active {
  background: var(--color-brand);
  border-color: var(--color-brand);
  color: #fff;
}

.appl-grid {
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 1.25rem;
  display: grid;
}

.appl-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  flex-direction: column;
  gap: 1rem;
  padding: 1.25rem;
  transition: border-color .15s, box-shadow .15s;
  display: flex;
}

.appl-card:hover {
  border-color: var(--color-brand-muted, rgba(19, 27, 46, .4));
  box-shadow: 0 4px 16px rgba(0, 0, 0, .2);
}

.appl-card--overdue {
  background: rgba(239, 68, 68, .04);
  border-color: rgba(239, 68, 68, .5);
}

.appl-card--due-soon {
  background: rgba(251, 146, 60, .04);
  border-color: rgba(251, 146, 60, .4);
}

.appl-card--unknown {
  opacity: .85;
}

.appl-card-header {
  align-items: flex-start;
  gap: .75rem;
  display: flex;
}

.appl-card-icon {
  color: var(--color-brand);
  flex-shrink: 0;
  margin-top: .1rem;
  font-size: 1.5rem;
}

.appl-card--overdue .appl-card-icon {
  color: #f87171;
}

.appl-card--due-soon .appl-card-icon {
  color: #fb923c;
}

.appl-card-title-wrap {
  flex-direction: column;
  flex: 1;
  gap: .15rem;
  min-width: 0;
  display: flex;
}

.appl-card-name {
  color: var(--color-text-primary);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 1rem;
  font-weight: 600;
  overflow: hidden;
}

.appl-card-type {
  color: var(--color-text-tertiary);
  font-size: .75rem;
}

.appl-badge {
  white-space: nowrap;
  border-radius: 999px;
  flex-shrink: 0;
  padding: .2rem .6rem;
  font-size: .7rem;
  font-weight: 700;
}

.appl-badge--overdue {
  color: #f87171;
  background: rgba(239, 68, 68, .2);
}

.appl-badge--due-soon {
  color: #fb923c;
  background: rgba(251, 146, 60, .2);
}

.appl-badge--ok {
  color: #4ade80;
  background: rgba(34, 197, 94, .15);
}

.appl-badge--unknown {
  color: #94a3b8;
  background: rgba(100, 116, 139, .15);
}

.appl-card-meta {
  background: var(--color-surface, rgba(0, 0, 0, .15));
  border-radius: var(--radius-md);
  flex-direction: column;
  gap: .4rem;
  padding: .75rem;
  display: flex;
}

.appl-meta-row {
  align-items: center;
  gap: .5rem;
  display: flex;
}

.appl-meta-icon {
  color: var(--color-text-tertiary);
  flex-shrink: 0;
  font-size: .9rem;
}

.appl-meta-val {
  color: var(--color-text-secondary);
  font-size: .8125rem;
}

.appl-cond {
  border-radius: 4px;
  padding: .1rem .5rem;
  font-size: .8125rem;
  font-weight: 600;
}

.appl-cond--good {
  color: #4ade80;
  background: rgba(34, 197, 94, .15);
}

.appl-cond--fair {
  color: #fb923c;
  background: rgba(251, 146, 60, .15);
}

.appl-cond--poor {
  color: #f87171;
  background: rgba(239, 68, 68, .15);
}

.appl-cond--critical {
  color: #ef4444;
  background: rgba(239, 68, 68, .3);
  font-weight: 800;
}

.appl-cond--unknown {
  color: #94a3b8;
  background: rgba(100, 116, 139, .15);
}

.appl-card-dates {
  align-items: flex-start;
  gap: 1rem;
  display: flex;
}

.appl-date-item {
  flex-direction: column;
  flex: 1;
  gap: .15rem;
  display: flex;
}

.appl-date-label {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--color-text-tertiary);
  font-size: .7rem;
  font-weight: 600;
}

.appl-date-val {
  color: var(--color-text-primary);
  font-size: .875rem;
  font-weight: 500;
}

.appl-date-sub {
  color: var(--color-text-tertiary);
  font-size: .75rem;
}

.appl-date-divider {
  background: var(--color-border);
  align-self: stretch;
  width: 1px;
  margin-top: .25rem;
}

.appl-card-skel {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  flex-direction: column;
  gap: .875rem;
  padding: 1.25rem;
  display: flex;
}

.appl-skel {
  background: var(--color-skeleton-base, rgba(255, 255, 255, .06));
  border-radius: 4px;
  animation: 1.4s ease-in-out infinite pulse;
}

.appl-skel--icon {
  border-radius: 50%;
  width: 2rem;
  height: 2rem;
}

.appl-skel--title {
  width: 65%;
  height: 1rem;
}

.appl-skel--sub {
  width: 40%;
  height: .75rem;
}

.appl-skel--meta {
  height: 3rem;
}

.appl-skel--date {
  width: 55%;
  height: .75rem;
}

.appl-empty {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: .75rem;
  padding: 5rem 2rem;
  display: flex;
}

.appl-empty-icon {
  color: var(--color-text-tertiary);
  font-size: 3rem;
}

.appl-empty-title {
  color: var(--color-text-primary);
  margin: 0;
  font-size: 1.125rem;
  font-weight: 600;
}

.appl-empty-sub {
  color: var(--color-text-tertiary);
  margin: 0;
  font-size: .875rem;
}

.appl-error {
  text-align: center;
  color: var(--color-error, #f87171);
  flex-direction: column;
  align-items: center;
  gap: .75rem;
  padding: 4rem 2rem;
  display: flex;
}

.appl-error .material-symbols-outlined {
  font-size: 2.5rem;
}

.appl-error p {
  color: var(--color-text-secondary);
  margin: 0;
}

.comms-page {
  height: calc(100vh - var(--nav-height, 64px));
  display: flex;
  overflow: hidden;
}

.comms-sidebar {
  border-right: 1px solid var(--color-border);
  background: var(--color-surface-raised);
  flex-direction: column;
  flex-shrink: 0;
  width: 320px;
  min-width: 260px;
  max-width: 360px;
  display: flex;
}

.comms-sidebar-header {
  border-bottom: 1px solid var(--color-border);
  flex-direction: column;
  gap: .75rem;
  padding: 1.25rem 1rem .75rem;
  display: flex;
}

.comms-sidebar-actions {
  flex-wrap: wrap;
  gap: .5rem;
  display: flex;
}

.comms-compose-btn {
  border-radius: var(--radius-md);
  background: var(--navy);
  border: 1px solid var(--navy);
  color: #fff;
  cursor: pointer;
  align-items: center;
  gap: .4rem;
  padding: .55rem .9rem;
  font-size: .875rem;
  font-weight: 600;
  display: inline-flex;
}

.comms-compose-btn:hover {
  opacity: .92;
}

.comms-compose-btn .material-symbols-outlined {
  font-size: 1.05rem;
}

@media (width <= 767px) {
  .comms-page {
    height: auto;
    min-height: calc(100vh - var(--nav-height, 64px));
    flex-direction: column;
  }

  .comms-sidebar {
    border-right: none;
    border-bottom: 1px solid var(--color-border);
    width: 100%;
    min-width: 0;
    max-width: none;
    max-height: 42vh;
  }

  .comms-main {
    min-height: 28rem;
  }
}

@media (width >= 768px) {
  .comms-page {
    height: calc(100vh - var(--nav-height, 64px));
    display: flex;
  }

  .comms-sidebar {
    width: min(360px, 34vw);
    max-width: 420px;
  }
}

@media (width >= 1024px) {
  .comms-page {
    width: 100%;
    max-width: none;
  }

  .comms-sidebar {
    width: min(380px, 32vw);
    max-width: 440px;
  }
}

.comms-sidebar-title {
  color: var(--color-text-primary);
  margin: 0;
  font-size: 1.25rem;
  font-weight: 700;
}

.comms-support-btn {
  border-radius: var(--radius-md);
  color: #a5b4fc;
  cursor: pointer;
  background: linear-gradient(135deg, rgba(19, 27, 46, .25), rgba(139, 92, 246, .2));
  border: 1px solid rgba(19, 27, 46, .4);
  align-items: center;
  gap: .5rem;
  padding: .6rem 1rem;
  font-size: .875rem;
  font-weight: 600;
  transition: all .15s;
  display: flex;
}

.comms-support-btn:hover {
  background: linear-gradient(135deg, rgba(19, 27, 46, .35), rgba(139, 92, 246, .3));
}

.comms-support-btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.comms-support-btn .material-symbols-outlined {
  font-size: 1.1rem;
}

.folio-layout .comms-support-btn {
  background: linear-gradient(135deg, #000 0%, var(--navy) 100%);
  border: 1px solid var(--navy);
  color: #fff;
}

.folio-layout .comms-support-btn:hover {
  opacity: .92;
  background: linear-gradient(135deg, #000 0%, var(--navy) 100%);
}

.comms-thread-list {
  flex: 1;
  overflow-y: auto;
}

.comms-thread {
  border: none;
  border-bottom: 1px solid var(--color-border);
  cursor: pointer;
  text-align: left;
  background: none;
  align-items: flex-start;
  gap: .75rem;
  width: 100%;
  padding: .875rem 1rem;
  transition: background .12s;
  display: flex;
}

.comms-thread:hover {
  background: rgba(255, 255, 255, .04);
}

.comms-thread--active {
  border-left: 3px solid var(--color-brand);
  background: rgba(19, 27, 46, .12);
}

.folio-layout .comms-thread--active {
  border-left: 3px solid var(--navy);
  color: var(--on-surface);
  background: #e8eaf6;
}

.folio-layout .comms-thread--active .comms-thread-name {
  color: var(--on-surface);
}

.folio-layout .comms-thread--active .comms-thread-preview {
  color: var(--on-surface-variant);
}

.comms-thread-avatar {
  background: rgba(255, 255, 255, .08);
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 2.25rem;
  height: 2.25rem;
  display: flex;
}

.comms-thread-avatar--support {
  color: #a5b4fc;
  background: linear-gradient(135deg, rgba(19, 27, 46, .4), rgba(139, 92, 246, .35));
}

.comms-thread-avatar .material-symbols-outlined {
  color: var(--color-text-tertiary);
  font-size: 1.1rem;
}

.comms-thread-body {
  flex-direction: column;
  flex: 1;
  gap: .2rem;
  min-width: 0;
  display: flex;
}

.comms-thread-top {
  justify-content: space-between;
  align-items: baseline;
  gap: .5rem;
  display: flex;
}

.comms-thread-name {
  color: var(--color-text-primary);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .875rem;
  font-weight: 600;
  overflow: hidden;
}

.comms-thread-time {
  color: var(--color-text-tertiary);
  flex-shrink: 0;
  font-size: .7rem;
}

.comms-thread-preview {
  color: var(--color-text-tertiary);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .8rem;
  overflow: hidden;
}

.comms-chip {
  text-transform: uppercase;
  letter-spacing: .04em;
  border-radius: 999px;
  margin-top: .25rem;
  padding: .1rem .5rem;
  font-size: .65rem;
  font-weight: 700;
  display: inline-block;
}

.comms-chip--support {
  color: #a5b4fc;
  background: rgba(19, 27, 46, .2);
}

.folio-layout .comms-chip--support {
  background: var(--navy);
  color: #fff;
}

.comms-chip--direct {
  color: #4ade80;
  background: rgba(34, 197, 94, .15);
}

.comms-chip--group {
  color: #fb923c;
  background: rgba(251, 146, 60, .15);
}

.comms-thread-skel-list {
  flex-direction: column;
  gap: 0;
  padding: .5rem 0;
  display: flex;
}

.comms-thread-skel {
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, .05);
  height: 72px;
  margin: .25rem .75rem;
  animation: 1.4s ease-in-out infinite pulse;
}

.comms-empty-threads, .comms-load-err {
  text-align: center;
  color: var(--color-text-tertiary);
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  padding: 2rem 1rem;
  font-size: .875rem;
  display: flex;
}

.comms-empty-threads .material-symbols-outlined {
  font-size: 2rem;
}

.comms-empty-sub {
  font-size: .8rem;
}

.comms-main {
  flex-direction: column;
  flex: 1;
  display: flex;
  overflow: hidden;
}

.comms-no-room {
  text-align: center;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: center;
  gap: .75rem;
  padding: 3rem;
  display: flex;
}

.comms-no-room-icon {
  color: var(--color-text-tertiary);
  font-size: 3rem;
}

.comms-no-room-title {
  color: var(--color-text-primary);
  margin: 0;
  font-size: 1.125rem;
  font-weight: 600;
}

.comms-no-room-sub {
  color: var(--color-text-tertiary);
  max-width: 320px;
  margin: 0;
  font-size: .875rem;
}

.comms-panel {
  flex-direction: column;
  height: 100%;
  display: flex;
  overflow: hidden;
}

.comms-panel-header {
  border-bottom: 1px solid var(--color-border);
  background: var(--color-surface-raised);
  flex-shrink: 0;
  align-items: center;
  gap: .75rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.comms-panel-icon {
  color: var(--color-brand);
  font-size: 1.25rem;
}

.comms-panel-title {
  color: var(--color-text-primary);
  flex: 1;
  font-size: 1rem;
  font-weight: 600;
}

.comms-panel-refresh {
  cursor: pointer;
  color: var(--color-text-tertiary);
  background: none;
  border: none;
  align-items: center;
  display: flex;
}

.comms-panel-refresh:hover {
  color: var(--color-text-primary);
}

.comms-messages {
  flex-direction: column;
  flex: 1;
  gap: .75rem;
  padding: 1.25rem;
  display: flex;
  overflow-y: auto;
}

.comms-msg-list {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.comms-msgs-loading {
  color: var(--color-text-tertiary);
  justify-content: center;
  padding: 3rem;
  display: flex;
}

.comms-msg-empty {
  text-align: center;
  color: var(--color-text-tertiary);
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  padding: 3rem;
  display: flex;
}

.comms-msg-empty .material-symbols-outlined {
  font-size: 2.5rem;
}

.comms-msg-error {
  color: var(--color-error, #f87171);
  padding: 1rem;
  font-size: .875rem;
}

.comms-msg {
  flex-direction: column;
  gap: .2rem;
  max-width: 72%;
  display: flex;
}

.comms-msg--mine {
  align-self: flex-end;
  align-items: flex-end;
}

.comms-msg--theirs {
  align-self: flex-start;
  align-items: flex-start;
}

.comms-bubble {
  border-radius: 1rem;
  padding: .6rem .875rem;
  line-height: 1.5;
}

.comms-msg--mine .comms-bubble {
  background: var(--color-brand);
  color: #fff;
  border-bottom-right-radius: 4px;
}

.comms-msg--theirs .comms-bubble {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  color: var(--color-text-primary);
  border-bottom-left-radius: 4px;
}

.comms-bubble-text {
  white-space: pre-wrap;
  word-break: break-word;
  font-size: .9rem;
}

.comms-msg-time {
  color: var(--color-text-tertiary);
  padding: 0 .25rem;
  font-size: .7rem;
}

.comms-composer {
  border-top: 1px solid var(--color-border);
  background: var(--color-surface-raised);
  flex-shrink: 0;
  align-items: flex-end;
  gap: .75rem;
  padding: .875rem 1.25rem;
  display: flex;
}

.comms-composer-input {
  background: var(--color-surface, rgba(0, 0, 0, .2));
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  color: var(--color-text-primary);
  resize: none;
  outline: none;
  flex: 1;
  padding: .6rem .875rem;
  font-family: inherit;
  font-size: .9rem;
  transition: border-color .15s;
}

.comms-composer-input:focus {
  border-color: var(--color-brand);
}

.comms-send-btn {
  background: var(--color-brand);
  cursor: pointer;
  border: none;
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 2.5rem;
  height: 2.5rem;
  transition: opacity .15s, transform .1s;
  display: flex;
}

.comms-send-btn:hover:not(:disabled) {
  opacity: .9;
  transform: scale(1.05);
}

.comms-send-btn:disabled {
  opacity: .4;
  cursor: not-allowed;
}

.comms-send-btn .material-symbols-outlined {
  color: #fff;
  font-size: 1.1rem;
}

@keyframes comms-spin {
  to {
    transform: rotate(360deg);
  }
}

.comms-spin {
  animation: 1s linear infinite comms-spin;
  display: inline-block;
}

.map-page {
  height: calc(100vh - var(--nav-height, 64px));
  box-sizing: border-box;
  flex-direction: column;
  gap: 1.5rem;
  padding: 2rem 2.5rem;
  display: flex;
  overflow: hidden;
}

.map-header {
  flex-direction: column;
  flex-shrink: 0;
  gap: .25rem;
  display: flex;
}

.map-title {
  color: var(--color-text-primary);
  margin: 0;
  font-size: 1.75rem;
  font-weight: 700;
}

.map-subtitle {
  color: var(--color-text-tertiary);
  margin: 0;
  font-size: .875rem;
}

.map-kpi-strip {
  flex-shrink: 0;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  display: grid;
}

@media (width <= 900px) {
  .map-kpi-strip {
    grid-template-columns: repeat(2, 1fr);
  }
}

.map-kpi-strip--loading {
  min-height: 80px;
}

.map-kpi-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.map-kpi-card--vacant {
  border-color: rgba(251, 146, 60, .4);
}

.map-kpi-card--str {
  border-color: rgba(19, 27, 46, .35);
}

.map-kpi-icon {
  color: var(--color-brand);
  font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24;
  font-size: 1.5rem;
}

.map-kpi-card--vacant .map-kpi-icon {
  color: #fb923c;
}

.map-kpi-card--str .map-kpi-icon {
  color: var(--primary);
}

.map-kpi-body {
  flex-direction: column;
  display: flex;
}

.map-kpi-value {
  color: var(--color-text-primary);
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1;
}

.map-kpi-label {
  color: var(--color-text-tertiary);
  margin-top: .15rem;
  font-size: .75rem;
}

.map-kpi-skel {
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, .06);
  height: 80px;
  animation: 1.4s ease-in-out infinite pulse;
}

.map-body {
  flex: 1;
  gap: 1rem;
  min-height: 0;
  display: flex;
}

.map-pin-list {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  flex-shrink: 0;
  width: 260px;
  min-width: 220px;
  overflow-y: auto;
}

.map-pin-list--loading {
  background: rgba(255, 255, 255, .04);
}

.map-pin-list-header {
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--color-text-tertiary);
  border-bottom: 1px solid var(--color-border);
  padding: .875rem 1rem .5rem;
  font-size: .75rem;
  font-weight: 700;
}

.map-pin-item {
  border-bottom: 1px solid var(--color-border);
  align-items: center;
  gap: .75rem;
  padding: .75rem 1rem;
  display: flex;
}

.map-pin-item:last-child {
  border-bottom: none;
}

.map-pin-dot {
  border-radius: 50%;
  flex-shrink: 0;
  width: 10px;
  height: 10px;
}

.map-pin-info {
  flex-direction: column;
  flex: 1;
  gap: .1rem;
  min-width: 0;
  display: flex;
}

.map-pin-name {
  color: var(--color-text-primary);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .8rem;
  font-weight: 600;
  overflow: hidden;
}

.map-pin-addr {
  color: var(--color-text-tertiary);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .72rem;
  overflow: hidden;
}

.map-pin-status {
  text-transform: capitalize;
  flex-shrink: 0;
  font-size: .7rem;
  font-weight: 600;
}

.map-container {
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
  background: #e8eef4;
  flex: 1;
  min-width: 0;
  position: relative;
  overflow: hidden;
}

.map-container--light {
  background: #e8eef4;
}

.map-leaflet {
  width: 100%;
  height: 100%;
}

.map-legend {
  color: var(--color-text-tertiary);
  flex-wrap: wrap;
  flex-shrink: 0;
  gap: .75rem 1.25rem;
  font-size: .75rem;
  display: flex;
}

.map-legend__item {
  align-items: center;
  gap: .35rem;
  display: inline-flex;
}

.map-legend__dot {
  border-radius: 50%;
  width: 8px;
  height: 8px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .08);
}

.atlas-map-pin {
  background: none !important;
  border: none !important;
}

.atlas-map-pin__dot {
  border: 2px solid #fff;
  border-radius: 50%;
  width: 14px;
  height: 14px;
  position: relative;
  box-shadow: 0 2px 6px rgba(15, 23, 42, .35);
}

.atlas-map-pin-badge {
  color: #fff;
  text-align: center;
  background: #ef4444;
  border-radius: 999px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  font: 700 9px / 16px system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
  position: absolute;
  top: -6px;
  right: -6px;
}

.atlas-map-popup .leaflet-popup-content-wrapper {
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .12);
}

.atlas-map-popup .leaflet-popup-tip {
  background: var(--surface-container-lowest);
}

.atlas-map-popup__inner {
  min-width: 200px;
  font-family: inherit;
}

.atlas-map-popup__title {
  margin-bottom: 4px;
  font-size: .95rem;
  font-weight: 700;
}

.atlas-map-popup__sub {
  color: var(--on-surface-variant);
  margin-bottom: 6px;
  font-size: .8rem;
}

.atlas-map-popup__pill {
  background: rgba(15, 23, 42, .06);
  border-radius: 999px;
  padding: 2px 8px;
  font-size: .7rem;
  font-weight: 700;
  display: inline-block;
}

.atlas-map-popup__pill--str {
  color: var(--primary);
  background: rgba(19, 27, 46, .12);
}

.atlas-map-popup__wo {
  color: #b91c1c;
  margin: 6px 0;
  font-size: .75rem;
}

.atlas-map-popup__actions {
  gap: 8px;
  margin-top: 8px;
  display: flex;
}

.atlas-map-popup__actions a {
  color: #2563eb;
  font-size: .75rem;
  font-weight: 700;
}

.map-loading, .map-empty, .map-error {
  text-align: center;
  height: 100%;
  color: var(--color-text-tertiary);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .75rem;
  display: flex;
}

.map-empty-icon {
  font-size: 3rem;
}

.map-empty-title {
  color: var(--color-text-primary);
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
}

.map-empty-sub {
  color: var(--color-text-tertiary);
  max-width: 280px;
  margin: 0;
  font-size: .85rem;
}

.map-error {
  color: var(--color-error, #f87171);
}

.map-error .material-symbols-outlined {
  font-size: 2rem;
}

@keyframes map-spin {
  to {
    transform: rotate(360deg);
  }
}

.map-spin {
  font-size: 2.5rem;
  animation: 1.5s linear infinite map-spin;
  display: inline-block;
}

.notif-page {
  box-sizing: border-box;
  flex-direction: column;
  gap: 1.5rem;
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
  padding: 2rem 2.5rem;
  display: flex;
}

.notif-header {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  display: flex;
}

.notif-header-left {
  flex-direction: column;
  gap: .25rem;
  display: flex;
}

.notif-title {
  color: var(--color-text-primary);
  margin: 0;
  font-size: 1.75rem;
  font-weight: 700;
}

.notif-subtitle {
  color: var(--color-text-tertiary);
  margin: 0;
  font-size: .875rem;
}

.notif-header-actions {
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem;
  display: flex;
}

.notif-unread-badge {
  color: #a5b4fc;
  background: rgba(19, 27, 46, .2);
  border: 1px solid rgba(19, 27, 46, .35);
  border-radius: 999px;
  padding: .35rem .75rem;
  font-size: .8rem;
  font-weight: 700;
}

.notif-action-btn {
  border-radius: var(--radius-md);
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  color: var(--color-text-secondary);
  cursor: pointer;
  align-items: center;
  gap: .4rem;
  padding: .5rem 1rem;
  font-size: .875rem;
  transition: all .15s;
  display: flex;
}

.notif-action-btn:hover {
  color: var(--color-text-primary);
  background: rgba(255, 255, 255, .06);
}

.notif-action-btn .material-symbols-outlined {
  font-size: 1rem;
}

.notif-tabs {
  border-bottom: 1px solid var(--color-border);
  gap: .25rem;
  padding-bottom: 0;
  display: flex;
}

.notif-tab {
  color: var(--color-text-tertiary);
  cursor: pointer;
  background: none;
  border: none;
  border-bottom: 2px solid rgba(0, 0, 0, 0);
  align-items: center;
  gap: .4rem;
  margin-bottom: -1px;
  padding: .625rem 1rem;
  font-size: .875rem;
  font-weight: 500;
  transition: all .15s;
  display: flex;
}

.notif-tab:hover {
  color: var(--color-text-primary);
}

.notif-tab--active {
  color: var(--color-brand);
  border-bottom-color: var(--color-brand);
}

.notif-tab .material-symbols-outlined {
  font-size: 1rem;
}

.notif-inbox {
  flex-direction: column;
  gap: 1rem;
  display: flex;
}

.notif-filter-strip {
  justify-content: space-between;
  align-items: center;
  padding: .5rem 0;
  display: flex;
}

.notif-filter-hint {
  color: var(--color-text-tertiary);
  font-size: .75rem;
}

.notif-toggle {
  cursor: pointer;
  color: var(--color-text-secondary);
  align-items: center;
  gap: .5rem;
  font-size: .875rem;
  display: flex;
}

.notif-toggle input[type="checkbox"] {
  accent-color: var(--color-brand);
  width: 1rem;
  height: 1rem;
}

.notif-skel-list {
  flex-direction: column;
  gap: .75rem;
  display: flex;
}

.notif-skel {
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, .05);
  height: 90px;
  animation: 1.4s ease-in-out infinite pulse;
}

.notif-empty {
  text-align: center;
  color: var(--color-text-tertiary);
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  padding: 3rem;
  display: flex;
}

.notif-empty-icon {
  font-size: 3rem !important;
}

.notif-empty-title {
  color: var(--color-text-primary);
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
}

.notif-empty-sub {
  color: var(--color-text-tertiary);
  margin: 0;
  font-size: .85rem;
}

.notif-list {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.notif-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  border-left: 3px solid rgba(0, 0, 0, 0);
  align-items: flex-start;
  gap: 1rem;
  padding: 1rem 1.25rem;
  transition: background .12s;
  display: flex;
}

.notif-card:hover {
  background: rgba(255, 255, 255, .04);
}

.notif-card--unread {
  border-left-color: var(--color-brand);
  background: rgba(19, 27, 46, .06);
}

.notif-card-icon-col {
  flex-direction: column;
  flex-shrink: 0;
  align-items: center;
  gap: .4rem;
  padding-top: .1rem;
  display: flex;
}

.notif-card-icon {
  color: var(--color-brand);
  font-size: 1.4rem !important;
}

.notif-unread-dot {
  background: var(--color-brand);
  border-radius: 50%;
  width: 8px;
  height: 8px;
}

.notif-card-body {
  flex-direction: column;
  flex: 1;
  gap: .35rem;
  min-width: 0;
  display: flex;
}

.notif-card-top {
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  display: flex;
}

.notif-card-title {
  color: var(--color-text-primary);
  font-size: .9rem;
  font-weight: 600;
}

.notif-card-body-text {
  color: var(--color-text-secondary);
  margin: 0;
  font-size: .85rem;
  line-height: 1.5;
}

.notif-card-footer {
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  margin-top: .1rem;
  display: flex;
}

.notif-card-time {
  color: var(--color-text-tertiary);
  font-size: .72rem;
}

.notif-badge {
  text-transform: uppercase;
  letter-spacing: .04em;
  border-radius: 999px;
  padding: .15rem .5rem;
  font-size: .65rem;
  font-weight: 700;
}

.notif-badge--urgent {
  color: #f87171;
  background: rgba(239, 68, 68, .2);
}

.notif-badge--high {
  color: #fb923c;
  background: rgba(251, 146, 60, .2);
}

.notif-badge--low {
  color: #94a3b8;
  background: rgba(100, 116, 139, .2);
}

.notif-delivery-chip {
  border: 1px solid var(--color-border);
  color: var(--color-text-tertiary);
  background: rgba(255, 255, 255, .06);
  border-radius: 999px;
  align-items: center;
  gap: .2rem;
  padding: .1rem .45rem;
  font-size: .68rem;
  display: inline-flex;
}

.notif-delivery-chip .material-symbols-outlined {
  font-size: .8rem !important;
}

.notif-card-actions {
  flex-direction: column;
  flex-shrink: 0;
  gap: .25rem;
  display: flex;
}

.notif-icon-btn {
  cursor: pointer;
  width: 2rem;
  height: 2rem;
  color: var(--color-text-tertiary);
  background: none;
  border: none;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  transition: all .15s;
  display: flex;
}

.notif-icon-btn:hover {
  color: var(--color-text-primary);
  background: rgba(255, 255, 255, .08);
}

.notif-icon-btn--dismiss:hover {
  color: var(--color-error, #f87171);
}

.notif-icon-btn .material-symbols-outlined {
  font-size: 1rem;
}

.notif-channels {
  flex-direction: column;
  gap: 2rem;
  display: flex;
}

.notif-section {
  flex-direction: column;
  gap: 1rem;
  display: flex;
}

.notif-section-header {
  flex-direction: column;
  gap: .2rem;
  display: flex;
}

.notif-section-title {
  color: var(--color-text-primary);
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
}

.notif-section-sub {
  color: var(--color-text-tertiary);
  margin: 0;
  font-size: .82rem;
}

.notif-pref-skel-list {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.notif-pref-skel {
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, .05);
  height: 70px;
  animation: 1.4s ease-in-out infinite pulse;
}

.notif-no-prefs {
  color: var(--color-text-tertiary);
  padding: 1rem 0;
  font-size: .85rem;
}

.notif-err {
  color: var(--color-error, #f87171);
  font-size: .85rem;
}

.notif-pref-list {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.notif-pref-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  align-items: flex-start;
  gap: 1rem;
  padding: .875rem 1rem;
  display: flex;
}

.notif-pref-icon {
  width: 2.25rem;
  height: 2.25rem;
  color: var(--color-brand);
  background: rgba(255, 255, 255, .06);
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: flex;
}

.notif-pref-icon .material-symbols-outlined {
  font-size: 1.1rem;
}

.notif-pref-body {
  flex-direction: column;
  flex: 1;
  gap: .3rem;
  min-width: 0;
  display: flex;
}

.notif-pref-top {
  align-items: center;
  gap: .5rem;
  display: flex;
}

.notif-pref-label {
  color: var(--color-text-primary);
  font-size: .9rem;
  font-weight: 600;
}

.notif-pref-chip {
  border-radius: 999px;
  padding: .1rem .5rem;
  font-size: .7rem;
  font-weight: 700;
}

.notif-pref-chip--on {
  color: #4ade80;
  background: rgba(34, 197, 94, .15);
}

.notif-pref-chip--off {
  color: #94a3b8;
  background: rgba(100, 116, 139, .15);
}

.notif-pref-config {
  color: var(--color-text-tertiary);
  border-radius: var(--radius-sm);
  white-space: pre-wrap;
  word-break: break-all;
  background: rgba(0, 0, 0, .2);
  margin: 0;
  padding: .4rem .6rem;
  font-family: JetBrains Mono, monospace;
  font-size: .75rem;
  overflow-x: auto;
}

.notif-pref-applies {
  color: var(--color-text-tertiary);
  margin: 0;
  font-size: .75rem;
}

.notif-form-card {
  background: var(--color-surface-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  flex-direction: column;
  gap: 1rem;
  padding: 1.25rem;
  display: flex;
}

.notif-form-title {
  color: var(--color-text-primary);
  margin: 0;
  font-size: .9rem;
  font-weight: 700;
}

.notif-form-grid {
  grid-template-columns: 1fr 2fr;
  align-items: start;
  gap: .75rem;
  display: grid;
}

.notif-form-field {
  flex-direction: column;
  gap: .3rem;
  display: flex;
}

.notif-form-field--wide {
  grid-column: span 1;
}

.notif-form-field--inline {
  grid-column: 1 / -1;
}

.notif-label {
  color: var(--color-text-tertiary);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: .78rem;
  font-weight: 600;
}

.notif-label-hint {
  color: var(--color-text-tertiary);
  text-transform: none;
  letter-spacing: 0;
  font-size: .72rem;
  font-weight: 400;
}

.notif-select, .notif-input {
  background: var(--color-surface, rgba(0, 0, 0, .2));
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  color: var(--color-text-primary);
  box-sizing: border-box;
  outline: none;
  width: 100%;
  padding: .5rem .75rem;
  font-size: .875rem;
  transition: border-color .15s;
}

.notif-select:focus, .notif-input:focus {
  border-color: var(--color-brand);
}

.notif-textarea {
  background: var(--color-surface, rgba(0, 0, 0, .2));
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  color: var(--color-text-primary);
  box-sizing: border-box;
  resize: vertical;
  outline: none;
  width: 100%;
  padding: .5rem .75rem;
  font-family: JetBrains Mono, monospace;
  font-size: .82rem;
  transition: border-color .15s;
}

.notif-textarea:focus {
  border-color: var(--color-brand);
}

.notif-save-btn {
  border-radius: var(--radius-md);
  background: var(--color-brand);
  cursor: pointer;
  color: #fff;
  border: none;
  align-self: flex-start;
  padding: .55rem 1.25rem;
  font-size: .875rem;
  font-weight: 600;
  transition: opacity .15s;
}

.notif-save-btn:hover:not(:disabled) {
  opacity: .9;
}

.notif-save-btn:disabled {
  opacity: .4;
  cursor: not-allowed;
}

.notif-settings-grid {
  flex-direction: column;
  gap: 0;
  display: flex;
}

.notif-setting-row {
  border-bottom: 1px solid var(--color-border);
  align-items: center;
  gap: 1rem;
  padding: .75rem 1rem;
  display: flex;
}

.notif-setting-row:last-child {
  border-bottom: none;
}

.notif-setting-key {
  color: var(--color-text-primary);
  flex: 1;
  font-size: .82rem;
  font-weight: 600;
}

.notif-setting-value {
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: 1.5;
  font-family: JetBrains Mono, monospace;
  font-size: .8rem;
  overflow: hidden;
}

.notif-setting-value--set {
  color: var(--color-text-secondary);
}

.notif-setting-value--empty {
  color: var(--color-text-tertiary);
  font-style: italic;
}

.notif-setting-badge {
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #4ade80;
  background: rgba(34, 197, 94, .15);
  border-radius: 999px;
  padding: .15rem .5rem;
  font-size: .65rem;
  font-weight: 700;
}

.notif-setting-badge--missing {
  color: #f87171;
  background: rgba(239, 68, 68, .1);
}

.inbox-support-banner {
  cursor: pointer;
  text-align: left;
  background: linear-gradient(135deg, rgba(10, 132, 255, .08), rgba(94, 92, 230, .05));
  border: 1px solid rgba(10, 132, 255, .2);
  border-radius: 10px;
  align-items: center;
  gap: 1rem;
  width: 100%;
  margin-bottom: 1rem;
  padding: .9rem 1.25rem;
  transition: all .15s;
  display: flex;
}

.inbox-support-banner:hover {
  background: rgba(10, 132, 255, .12);
  border-color: rgba(10, 132, 255, .4);
}

.inbox-support-icon {
  flex-shrink: 0;
  font-size: 1.6rem;
}

.inbox-support-text {
  flex-direction: column;
  flex: 1;
  gap: .15rem;
  display: flex;
}

.inbox-support-title {
  color: var(--text-primary);
  font-size: .85rem;
  font-weight: 700;
}

.inbox-support-sub {
  color: var(--text-secondary);
  font-size: .72rem;
}

.inbox-support-cta {
  color: #0a84ff;
  flex-shrink: 0;
  font-size: .72rem;
  font-weight: 600;
}

.inbox-panel {
  border: 1px solid var(--border-default);
  background: var(--bg-surface);
  border-radius: 8px;
  flex-direction: column;
  flex: 1;
  min-height: 28rem;
  display: flex;
  overflow: hidden;
}

.inbox-thread-list {
  border-right: none;
  border-bottom: 1px solid var(--border-default);
  flex-direction: column;
  flex-shrink: 0;
  width: 100%;
  max-height: 42vh;
  display: flex;
  overflow: hidden;
}

@media (width >= 768px) {
  .inbox-panel {
    flex-direction: row;
    min-height: 480px;
  }

  .inbox-thread-list {
    border-right: 1px solid var(--border-default);
    border-bottom: none;
    width: min(20rem, 34vw);
    max-width: 24rem;
    max-height: none;
  }
}

@media (width >= 1024px) {
  .inbox-thread-list {
    width: min(22rem, 32vw);
    max-width: 26rem;
  }
}

.inbox-thread-list-header {
  border-bottom: 1px solid var(--border-default);
  flex-shrink: 0;
  padding: .875rem 1rem;
}

.inbox-thread-item {
  cursor: pointer;
  border-bottom: 1px solid rgba(255, 255, 255, .03);
  align-items: center;
  gap: .75rem;
  padding: .875rem 1rem;
  transition: background .1s;
  display: flex;
}

.inbox-thread-item:hover {
  background: rgba(255, 255, 255, .03);
}

.inbox-thread-item--selected {
  background: rgba(10, 132, 255, .08);
  border-left: 2px solid #0a84ff;
}

.inbox-thread-avatar {
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 2.2rem;
  height: 2.2rem;
  font-size: 1rem;
  display: flex;
}

.inbox-thread-avatar--support {
  background: linear-gradient(135deg, rgba(10, 132, 255, .133), rgba(94, 92, 230, .133));
  border: 1px solid rgba(10, 132, 255, .3);
}

.inbox-thread-avatar--default {
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .1);
}

.inbox-thread-meta {
  flex: 1;
  min-width: 0;
}

.inbox-thread-name {
  color: var(--text-primary);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: .78rem;
  font-weight: 600;
  overflow: hidden;
}

.inbox-thread-preview {
  color: var(--text-secondary);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: .68rem;
  overflow: hidden;
}

.inbox-thread-time {
  color: var(--text-secondary);
  flex-shrink: 0;
  font-size: .64rem;
}

.inbox-empty {
  text-align: center;
  color: var(--text-secondary);
  padding: 2rem;
  font-size: .78rem;
}

.inbox-thread-view {
  flex-direction: column;
  flex: 1;
  display: flex;
  overflow: hidden;
}

.inbox-thread-empty {
  text-align: center;
  color: var(--text-secondary);
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: center;
  padding: 2rem;
  display: flex;
}

.inbox-messages {
  flex-direction: column;
  flex: 1;
  gap: .875rem;
  padding: 1.25rem;
  display: flex;
  overflow-y: auto;
}

.inbox-msg-row {
  align-items: flex-end;
  gap: .625rem;
  display: flex;
}

.inbox-msg-row--left {
  justify-content: flex-start;
}

.inbox-msg-row--right {
  justify-content: flex-end;
}

.inbox-msg-avatar {
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 1.75rem;
  height: 1.75rem;
  font-size: .7rem;
  font-weight: 700;
  display: flex;
}

.inbox-msg-avatar--support {
  color: #fff;
  background: linear-gradient(135deg, #0a84ff, #5e5ce6);
}

.inbox-msg-avatar--self {
  color: #000;
  background: rgba(251, 191, 36, .7);
}

.inbox-msg-bubble-wrap {
  flex-direction: column;
  gap: .2rem;
  max-width: 72%;
  display: flex;
}

.inbox-msg-bubble-wrap--right {
  align-items: flex-end;
}

.inbox-msg-meta {
  color: var(--text-secondary);
  font-size: .63rem;
}

.inbox-msg-meta--right {
  text-align: right;
}

.inbox-msg-bubble {
  border-radius: 14px;
  padding: .625rem .875rem;
  font-size: .8rem;
  line-height: 1.5;
}

.inbox-msg-bubble--self {
  color: var(--text-primary);
  background: rgba(10, 132, 255, .15);
  border: 1px solid rgba(10, 132, 255, .25);
  border-bottom-right-radius: 4px;
}

.inbox-msg-bubble--support {
  color: var(--text-primary);
  background: rgba(94, 92, 230, .12);
  border: 1px solid rgba(94, 92, 230, .25);
  border-bottom-left-radius: 4px;
}

.inbox-msg-system {
  align-items: center;
  gap: .75rem;
  margin: .25rem 0;
  display: flex;
}

.inbox-msg-system-line {
  background: rgba(255, 255, 255, .06);
  flex: 1;
  height: 1px;
}

.inbox-msg-system-text {
  color: var(--text-secondary);
  white-space: nowrap;
  background: rgba(255, 255, 255, .03);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 999px;
  padding: .25rem .75rem;
  font-size: .68rem;
}

.inbox-compose {
  border-top: 1px solid var(--border-default);
  background: rgba(255, 255, 255, .02);
  flex-shrink: 0;
  align-items: flex-end;
  gap: .625rem;
  padding: .875rem 1rem;
  display: flex;
}

.inbox-compose-input {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  color: var(--text-primary);
  resize: none;
  border-radius: 10px;
  outline: none;
  flex: 1;
  padding: .625rem .875rem;
  font-size: .82rem;
}

.inbox-compose-input:focus {
  border-color: #0a84ff;
}

.inbox-compose-send {
  color: #fff;
  cursor: pointer;
  background: #0a84ff;
  border: none;
  border-radius: 10px;
  align-items: center;
  gap: .25rem;
  padding: .55rem 1rem;
  font-size: .78rem;
  font-weight: 700;
  transition: opacity .15s;
  display: flex;
}

.inbox-compose-send:hover:not(:disabled) {
  opacity: .88;
}

.inbox-compose-send:disabled {
  opacity: .4;
  cursor: not-allowed;
}

.hh-lease-card {
  background: rgba(10, 132, 255, .04);
  border: 1px solid rgba(10, 132, 255, .18);
  border-radius: 10px;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin-bottom: 1.25rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.hh-lease-field {
  flex-direction: column;
  gap: .2rem;
  min-width: 10rem;
  display: flex;
}

.hh-lease-label {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-secondary);
  font-size: .68rem;
  font-weight: 600;
}

.hh-lease-value {
  color: var(--text-primary);
  font-size: .88rem;
  font-weight: 600;
}

.hh-lease-status {
  color: #4ade80;
  text-transform: capitalize;
}

.hh-no-lease {
  color: #fbbf24;
  background: rgba(251, 191, 36, .06);
  border: 1px solid rgba(251, 191, 36, .2);
  border-radius: 10px;
  margin-bottom: 1rem;
  padding: 1rem 1.25rem;
  font-size: .82rem;
}

.hh-tabs {
  gap: .5rem;
  margin-bottom: 1.25rem;
  display: flex;
}

.hh-tab {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  color: var(--text-secondary);
  cursor: pointer;
  border-radius: 8px;
  padding: .5rem 1.25rem;
  font-size: .8rem;
  font-weight: 600;
  transition: all .15s;
}

.hh-tab:hover {
  color: var(--text-primary);
}

.hh-tab--active {
  color: #0a84ff;
  background: rgba(10, 132, 255, .15);
  border-color: rgba(10, 132, 255, .4);
}

.hh-section {
  flex-direction: column;
  gap: 1rem;
  display: flex;
}

.hh-section-header {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.hh-section-title {
  color: var(--text-primary);
  font-size: .88rem;
  font-weight: 700;
}

.hh-loading {
  color: var(--text-secondary);
  padding: 1rem 0;
  font-size: .78rem;
}

.hh-empty {
  color: var(--text-secondary);
  text-align: center;
  border: 1px dashed rgba(255, 255, 255, .08);
  border-radius: 8px;
  padding: 2rem;
  font-size: .8rem;
}

.hh-card-grid {
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1rem;
  display: grid;
}

.hh-member-card {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  border-radius: 10px;
  align-items: flex-start;
  gap: .875rem;
  padding: 1rem;
  transition: border-color .15s;
  display: flex;
  position: relative;
}

.hh-member-card:hover {
  border-color: rgba(255, 255, 255, .15);
}

.hh-member-card--former {
  opacity: .65;
}

.hh-member-avatar {
  flex-shrink: 0;
  font-size: 1.5rem;
}

.hh-member-info {
  flex-direction: column;
  flex: 1;
  gap: .2rem;
  display: flex;
}

.hh-member-name {
  color: var(--text-primary);
  font-size: .85rem;
  font-weight: 700;
}

.hh-member-rel {
  color: var(--text-secondary);
  font-size: .72rem;
  font-weight: 500;
}

.hh-member-meta {
  color: var(--text-secondary);
  font-size: .68rem;
}

.hh-member-date {
  color: rgba(255, 255, 255, .3);
}

.hh-vehicle-card {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  border-radius: 10px;
  align-items: flex-start;
  gap: .875rem;
  padding: 1rem;
  display: flex;
  position: relative;
}

.hh-vehicle-icon {
  flex-shrink: 0;
  font-size: 1.8rem;
}

.hh-vehicle-info {
  flex-direction: column;
  flex: 1;
  gap: .2rem;
  display: flex;
}

.hh-vehicle-name {
  color: var(--text-primary);
  font-size: .85rem;
  font-weight: 700;
}

.hh-vehicle-plate {
  color: #0a84ff;
  font-family: monospace;
  font-size: .78rem;
  font-weight: 600;
}

.hh-vehicle-meta {
  color: var(--text-secondary);
  font-size: .68rem;
}

.hh-badge {
  text-transform: uppercase;
  letter-spacing: .04em;
  border-radius: 999px;
  padding: .15rem .5rem;
  font-size: .62rem;
  font-weight: 700;
  position: absolute;
  top: .75rem;
  right: .75rem;
}

.hh-badge--active {
  color: #4ade80;
  background: rgba(34, 197, 94, .12);
  border: 1px solid rgba(34, 197, 94, .2);
}

.hh-badge--former {
  color: #94a3b8;
  background: rgba(148, 163, 184, .1);
  border: 1px solid rgba(148, 163, 184, .15);
}

.hh-former-section {
  margin-top: .75rem;
}

.hh-former-summary {
  color: var(--text-secondary);
  cursor: pointer;
  padding: .5rem 0;
  font-size: .75rem;
  font-weight: 600;
  list-style: none;
}

.hh-former-summary::-webkit-details-marker {
  display: none;
}

.hh-former-summary:before {
  content: "▸ ";
}

details[open] .hh-former-summary:before {
  content: "▾ ";
}

.doc-action-banner {
  background: rgba(251, 191, 36, .07);
  border: 1px solid rgba(251, 191, 36, .25);
  border-radius: 10px;
  align-items: center;
  gap: .875rem;
  margin-bottom: 1.25rem;
  padding: .875rem 1.25rem;
  font-size: .82rem;
  display: flex;
}

.doc-action-icon {
  flex-shrink: 0;
  font-size: 1.4rem;
}

.doc-action-btn {
  color: #fbbf24;
  cursor: pointer;
  background: rgba(251, 191, 36, .1);
  border: 1px solid rgba(251, 191, 36, .3);
  border-radius: 7px;
  flex-shrink: 0;
  margin-left: auto;
  padding: .35rem .875rem;
  font-size: .75rem;
  font-weight: 700;
}

.doc-action-btn:hover {
  background: rgba(251, 191, 36, .18);
}

.doc-filter-row {
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: 1.25rem;
  display: flex;
}

.filter-pill {
  border: 1px solid var(--border-default);
  background: var(--bg-surface-high);
  color: var(--text-secondary);
  cursor: pointer;
  border-radius: 999px;
  padding: .35rem .875rem;
  font-size: .75rem;
  font-weight: 600;
  transition: all .15s;
}

.filter-pill:hover {
  color: var(--text-primary);
  border-color: rgba(255, 255, 255, .2);
}

.filter-pill--active {
  color: #0a84ff;
  background: rgba(10, 132, 255, .15);
  border-color: rgba(10, 132, 255, .4);
}

.doc-grid {
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1rem;
  display: grid;
}

.doc-card {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  cursor: pointer;
  border-radius: 10px;
  flex-direction: column;
  gap: .625rem;
  padding: 1rem;
  transition: all .15s;
  display: flex;
  position: relative;
}

.doc-card:hover {
  border-color: rgba(255, 255, 255, .18);
  transform: translateY(-1px);
}

.doc-card-icon {
  font-size: 2rem;
}

.doc-card-body {
  flex-direction: column;
  gap: .2rem;
  display: flex;
}

.doc-card-title {
  color: var(--text-primary);
  font-size: .82rem;
  font-weight: 700;
}

.doc-card-meta {
  color: var(--text-secondary);
  font-size: .68rem;
}

.doc-card-badges {
  flex-wrap: wrap;
  gap: .35rem;
  margin-top: .375rem;
  display: flex;
}

.doc-badge {
  text-transform: uppercase;
  letter-spacing: .03em;
  border-radius: 999px;
  padding: .18rem .5rem;
  font-size: .62rem;
  font-weight: 700;
}

.doc-badge--action {
  color: #fbbf24;
  background: rgba(251, 191, 36, .12);
  border: 1px solid rgba(251, 191, 36, .3);
}

.doc-badge--signed {
  color: #4ade80;
  background: rgba(34, 197, 94, .1);
  border: 1px solid rgba(34, 197, 94, .25);
}

.doc-badge--shared {
  color: #60a5fa;
  background: rgba(10, 132, 255, .1);
  border: 1px solid rgba(10, 132, 255, .25);
}

.doc-empty {
  text-align: center;
  color: var(--text-secondary);
  padding: 3rem;
  font-size: .82rem;
}

.doc-detail-list {
  grid-template-columns: max-content 1fr;
  gap: .5rem 1.25rem;
  font-size: .82rem;
  display: grid;
}

.doc-detail-list dt {
  color: var(--text-secondary);
  font-weight: 600;
}

.doc-detail-list dd {
  color: var(--text-primary);
}

.doc-sign-prompt {
  color: #fbbf24;
  background: rgba(251, 191, 36, .06);
  border: 1px solid rgba(251, 191, 36, .2);
  border-radius: 8px;
  margin-top: .75rem;
  padding: .875rem 1rem;
  font-size: .78rem;
}

.ph-table-wrap {
  border: 1px solid var(--border-default);
  background: var(--bg-surface-high);
  border-radius: 8px;
  overflow-x: auto;
}

.ph-table {
  border-collapse: collapse;
  width: 100%;
  font-size: .8rem;
}

.ph-table thead th {
  text-align: left;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-secondary);
  border-bottom: 1px solid var(--border-default);
  white-space: nowrap;
  padding: .75rem 1rem;
  font-size: .68rem;
  font-weight: 700;
}

.ph-row {
  border-bottom: 1px solid rgba(255, 255, 255, .04);
  transition: background .1s;
}

.ph-row:last-child {
  border-bottom: none;
}

.ph-row:hover {
  background: rgba(255, 255, 255, .024);
}

.ph-row td {
  vertical-align: middle;
  padding: .75rem 1rem;
}

.ph-date {
  color: var(--text-secondary);
  white-space: nowrap;
  font-size: .75rem;
}

.ph-desc {
  color: var(--text-primary);
  max-width: 18rem;
  font-weight: 500;
}

.ph-rail {
  white-space: nowrap;
}

.ph-rail-wrap {
  color: var(--text-secondary);
  align-items: center;
  gap: .25rem;
  font-size: .75rem;
  display: flex;
}

.ph-amount {
  white-space: nowrap;
  font-family: monospace;
  font-weight: 700;
}

.ph-due {
  color: var(--text-secondary);
  font-size: .75rem;
}

.ph-paid-at {
  color: #4ade80;
}

.ph-badge {
  text-transform: uppercase;
  letter-spacing: .03em;
  border-radius: 999px;
  padding: .2rem .55rem;
  font-size: .62rem;
  font-weight: 700;
}

.ph-badge--paid {
  color: #4ade80;
  background: rgba(34, 197, 94, .1);
}

.ph-badge--pending {
  color: #fbbf24;
  background: rgba(251, 191, 36, .1);
}

.ph-badge--overdue {
  color: #f87171;
  background: rgba(239, 68, 68, .1);
}

.ph-badge--cancelled {
  color: #94a3b8;
  background: rgba(148, 163, 184, .1);
}

.ph-badge--default {
  color: var(--text-secondary);
  background: rgba(255, 255, 255, .06);
}

.viol-info-banner {
  color: var(--text-secondary);
  background: rgba(10, 132, 255, .05);
  border: 1px solid rgba(10, 132, 255, .15);
  border-radius: 10px;
  align-items: flex-start;
  gap: .875rem;
  margin-bottom: 1.25rem;
  padding: .875rem 1.25rem;
  font-size: .78rem;
  display: flex;
}

.viol-info-icon {
  flex-shrink: 0;
  margin-top: .05rem;
  font-size: 1.1rem;
}

.viol-info-text {
  line-height: 1.55;
}

.viol-list {
  flex-direction: column;
  gap: .875rem;
  display: flex;
}

.viol-card {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  cursor: pointer;
  border-radius: 10px;
  align-items: flex-start;
  gap: .875rem;
  padding: 1rem 1.25rem;
  transition: all .15s;
  display: flex;
  position: relative;
}

.viol-card:hover {
  border-color: rgba(255, 255, 255, .15);
}

.viol-card--active {
  border-left: 3px solid #f87171;
}

.viol-card-icon {
  flex-shrink: 0;
  font-size: 1.5rem;
}

.viol-card-body {
  flex-direction: column;
  flex: 1;
  gap: .25rem;
  display: flex;
}

.viol-card-subject {
  color: var(--text-primary);
  font-size: .88rem;
  font-weight: 700;
}

.viol-card-category {
  color: var(--text-secondary);
  font-size: .72rem;
  font-weight: 500;
}

.viol-card-meta {
  color: var(--text-secondary);
  font-size: .7rem;
}

.viol-card-meta strong {
  color: #f87171;
}

.viol-badge {
  text-transform: uppercase;
  letter-spacing: .03em;
  border-radius: 999px;
  padding: .2rem .6rem;
  font-size: .62rem;
  font-weight: 700;
}

.viol-badge--open {
  color: #fbbf24;
  background: rgba(251, 191, 36, .12);
}

.viol-badge--cured {
  color: #4ade80;
  background: rgba(34, 197, 94, .12);
}

.viol-badge--escalated {
  color: #f87171;
  background: rgba(239, 68, 68, .12);
}

.viol-badge--dismissed {
  color: #94a3b8;
  background: rgba(148, 163, 184, .1);
}

.viol-badge--default {
  color: var(--text-secondary);
  background: rgba(255, 255, 255, .06);
}

.viol-empty {
  text-align: center;
  padding: 3rem;
}

.viol-empty-icon {
  margin-bottom: .5rem;
  font-size: 2.5rem;
}

.viol-empty-title {
  color: var(--text-primary);
  font-size: .88rem;
  font-weight: 700;
}

.viol-empty-sub {
  color: var(--text-secondary);
  margin-top: .25rem;
  font-size: .75rem;
}

.viol-detail-section {
  flex-direction: column;
  gap: .375rem;
  display: flex;
}

.viol-detail-label {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-secondary);
  font-size: .68rem;
  font-weight: 700;
}

.viol-detail-body {
  color: var(--text-primary);
  background: rgba(255, 255, 255, .03);
  border: 1px solid rgba(255, 255, 255, .06);
  border-radius: 8px;
  padding: .75rem;
  font-size: .82rem;
  line-height: 1.55;
}

.viol-cure-prompt {
  color: var(--text-primary);
  background: rgba(251, 191, 36, .06);
  border: 1px solid rgba(251, 191, 36, .2);
  border-radius: 8px;
  padding: .875rem;
  font-size: .78rem;
}

.viol-cure-prompt p {
  color: var(--text-secondary);
  margin-top: .35rem;
  line-height: 1.55;
}

.profile-skeleton {
  text-align: center;
  color: var(--text-secondary);
  padding: 2rem;
  font-size: .82rem;
}

.profile-layout {
  grid-template-columns: 15rem 1fr;
  align-items: start;
  gap: 1.5rem;
  display: grid;
}

@media (width <= 700px) {
  .profile-layout {
    grid-template-columns: 1fr;
  }
}

.profile-avatar-card {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  text-align: center;
  border-radius: 12px;
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  padding: 1.5rem;
  display: flex;
}

.profile-avatar {
  color: #fff;
  background: linear-gradient(135deg, #0a84ff, #5e5ce6);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 4.5rem;
  height: 4.5rem;
  font-size: 1.5rem;
  font-weight: 800;
  display: flex;
}

.profile-name {
  color: var(--text-primary);
  font-size: .95rem;
  font-weight: 700;
}

.profile-role-chip {
  color: #60a5fa;
  text-transform: uppercase;
  letter-spacing: .04em;
  background: rgba(10, 132, 255, .12);
  border: 1px solid rgba(10, 132, 255, .25);
  border-radius: 999px;
  padding: .2rem .75rem;
  font-size: .7rem;
  font-weight: 700;
}

.profile-email {
  color: var(--text-secondary);
  font-size: .72rem;
}

.profile-details {
  flex-direction: column;
  gap: 1rem;
  display: flex;
}

.profile-section {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  border-radius: 10px;
  padding: 1.25rem;
}

.profile-section--danger {
  border-color: rgba(239, 68, 68, .2);
}

.profile-section-title {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-secondary);
  margin-bottom: .875rem;
  font-size: .72rem;
  font-weight: 700;
}

.profile-dl {
  grid-template-columns: max-content 1fr;
  gap: .5rem 1.25rem;
  font-size: .82rem;
  display: grid;
}

.profile-dl dt {
  color: var(--text-secondary);
  font-weight: 600;
}

.profile-dl dd {
  color: var(--text-primary);
}

.profile-edit-row {
  align-items: center;
  gap: .5rem;
  display: flex;
}

.profile-edit-row .form-input {
  flex: 1;
}

.profile-security-row {
  flex-direction: column;
  gap: .875rem;
  display: flex;
}

.profile-security-item {
  background: rgba(255, 255, 255, .02);
  border: 1px solid rgba(255, 255, 255, .05);
  border-radius: 8px;
  align-items: center;
  gap: .875rem;
  padding: .75rem;
  display: flex;
}

.profile-security-icon {
  flex-shrink: 0;
  font-size: 1.3rem;
}

.profile-security-label {
  color: var(--text-primary);
  font-size: .82rem;
  font-weight: 600;
}

.profile-security-sub {
  color: var(--text-secondary);
  font-size: .7rem;
}

.profile-security-item .btn {
  flex-shrink: 0;
  margin-left: auto;
}

.profile-danger-row {
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  font-size: .82rem;
  display: flex;
}

.back-link {
  color: var(--text-secondary);
  margin-bottom: .25rem;
  font-size: .75rem;
  text-decoration: none;
  transition: color .15s;
  display: inline-block;
}

.back-link:hover {
  color: var(--text-primary);
}

.maint-detail-layout {
  flex-direction: column;
  gap: 1rem;
  display: flex;
}

.wo-detail-layout {
  flex-direction: column;
  gap: 1.25rem;
  display: flex;
}

.wo-detail-layout__main, .wo-detail-layout__aside {
  flex-direction: column;
  gap: 1.25rem;
  min-width: 0;
  display: flex;
}

@media (width >= 768px) {
  .wo-detail-layout {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
    gap: 1.25rem;
    display: grid;
  }
}

@media (width >= 1024px) {
  .wo-detail-layout {
    grid-template-columns: minmax(0, 1.65fr) minmax(18rem, 1fr);
    gap: 1.5rem;
  }
}

.folio-grid {
  grid-template-columns: 1fr;
  gap: .75rem;
  display: grid;
}

@media (width >= 768px) {
  .folio-grid--2 {
    grid-template-columns: 1fr 1fr;
  }
}

.maint-detail-card {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  border-radius: 10px;
  padding: 1.25rem;
}

.maint-detail-header {
  align-items: flex-start;
  gap: .875rem;
  margin-bottom: 1rem;
  display: flex;
}

.maint-detail-type-icon {
  flex-shrink: 0;
  font-size: 2rem;
}

.maint-detail-title-wrap {
  flex: 1;
}

.maint-detail-subject {
  color: var(--text-primary);
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
}

.maint-detail-type {
  color: var(--text-secondary);
  margin-top: .2rem;
  font-size: .72rem;
}

.maint-detail-status {
  text-transform: uppercase;
  letter-spacing: .03em;
  white-space: nowrap;
  border-style: solid;
  border-width: 1px;
  border-radius: 999px;
  padding: .25rem .75rem;
  font-size: .7rem;
  font-weight: 700;
}

.maint-detail-dl {
  grid-template-columns: max-content 1fr;
  gap: .45rem 1.25rem;
  font-size: .8rem;
  display: grid;
}

.maint-detail-dl dt {
  color: var(--text-secondary);
  font-weight: 600;
}

.maint-detail-dl dd {
  color: var(--text-primary);
}

.maint-timeline-title {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-secondary);
  margin-bottom: 1rem;
  font-size: .72rem;
  font-weight: 700;
}

.maint-timeline {
  gap: 0;
  display: flex;
}

.maint-timeline-step {
  flex-direction: column;
  flex: 1;
  align-items: center;
  gap: .375rem;
  display: flex;
  position: relative;
}

.maint-timeline-step:before {
  content: "";
  background: var(--border-default);
  z-index: 0;
  height: 2px;
  position: absolute;
  top: .6rem;
  left: 50%;
  right: -50%;
}

.maint-timeline-step:last-child:before {
  display: none;
}

.maint-timeline-dot {
  border: 2px solid var(--border-default);
  background: var(--bg-surface-high);
  z-index: 1;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 1.5rem;
  height: 1.5rem;
  font-size: .55rem;
  display: flex;
  position: relative;
}

.maint-timeline-step--done .maint-timeline-dot {
  background: var(--green);
  border-color: var(--green);
  color: #000;
}

.maint-timeline-step--active .maint-timeline-dot {
  color: #fff;
  background: #0a84ff;
  border-color: #0a84ff;
  font-size: .7rem;
}

.maint-timeline-label {
  color: var(--text-secondary);
  text-align: center;
  font-size: .65rem;
}

.maint-help-box {
  background: rgba(10, 132, 255, .05);
  align-items: center;
  gap: .875rem;
  display: flex;
  border-color: rgba(10, 132, 255, .15) !important;
}

.maint-help-icon {
  flex-shrink: 0;
  font-size: 1.5rem;
}

.maint-help-body {
  flex: 1;
}

.app-list {
  flex-direction: column;
  gap: 1.25rem;
  display: flex;
}

.app-card {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  border-radius: 12px;
  flex-direction: column;
  gap: 1rem;
  padding: 1.25rem;
  display: flex;
}

.app-card-header {
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  display: flex;
}

.app-card-title {
  align-items: center;
  gap: .75rem;
  display: flex;
}

.app-icon {
  font-size: 1.75rem;
}

.app-card-label {
  color: var(--text-primary);
  font-size: .88rem;
  font-weight: 700;
}

.app-card-address, .app-card-unit {
  color: var(--text-secondary);
  margin-top: .15rem;
  font-size: .75rem;
  line-height: 1.4;
}

.app-card-unit {
  color: var(--text-primary);
  opacity: .85;
  font-weight: 600;
}

.app-status-badge {
  white-space: nowrap;
  border-radius: 999px;
  padding: .3rem .875rem;
  font-size: .72rem;
  font-weight: 700;
}

.app-status--pending {
  color: #fbbf24;
  background: rgba(251, 191, 36, .1);
  border: 1px solid rgba(251, 191, 36, .25);
}

.app-status--approved {
  color: #4ade80;
  background: rgba(34, 197, 94, .1);
  border: 1px solid rgba(34, 197, 94, .25);
}

.app-status--denied {
  color: #f87171;
  background: rgba(239, 68, 68, .1);
  border: 1px solid rgba(239, 68, 68, .25);
}

.app-status--neutral {
  color: #94a3b8;
  background: rgba(148, 163, 184, .08);
  border: 1px solid rgba(148, 163, 184, .2);
}

.app-detail-grid {
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: .75rem;
  display: grid;
}

.app-detail-item {
  flex-direction: column;
  gap: .2rem;
  display: flex;
}

.app-detail-label {
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--text-secondary);
  font-size: .65rem;
  font-weight: 700;
}

.app-detail-value {
  color: var(--text-primary);
  font-size: .82rem;
  font-weight: 600;
}

.app-decision-reason {
  background: rgba(239, 68, 68, .06);
  border: 1px solid rgba(239, 68, 68, .15);
  border-radius: 8px;
  padding: .875rem;
}

.app-decision-label {
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #f87171;
  margin-bottom: .375rem;
  font-size: .65rem;
  font-weight: 700;
}

.app-decision-text {
  color: var(--text-primary);
  font-size: .8rem;
}

.app-fha-notice {
  color: var(--text-secondary);
  background: rgba(255, 255, 255, .02);
  border: 1px solid rgba(255, 255, 255, .05);
  border-radius: 8px;
  padding: .75rem;
  font-size: .68rem;
  line-height: 1.55;
}

.app-empty-state {
  text-align: center;
  padding: 3rem;
}

.app-empty-icon {
  margin-bottom: .5rem;
  font-size: 2.5rem;
}

.app-empty-title {
  color: var(--text-primary);
  font-size: .9rem;
  font-weight: 700;
}

.app-empty-sub {
  color: var(--text-secondary);
  margin-top: .25rem;
  font-size: .75rem;
}

.report-section {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  border-radius: 10px;
  margin-bottom: 1rem;
  padding: 1.25rem;
}

.report-section-title {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-secondary);
  margin-bottom: 1rem;
  font-size: .72rem;
  font-weight: 700;
}

.report-bar-chart {
  flex-direction: column;
  gap: .75rem;
  display: flex;
}

.report-bar-row {
  align-items: center;
  gap: .875rem;
  display: flex;
}

.report-bar-label {
  color: var(--text-secondary);
  flex-shrink: 0;
  width: 3rem;
  font-size: .75rem;
}

.report-bar-track {
  background: rgba(255, 255, 255, .06);
  border-radius: 999px;
  flex: 1;
  height: .5rem;
  overflow: hidden;
}

.report-bar-fill {
  background: linear-gradient(90deg, #0a84ff, #5e5ce6);
  border-radius: 999px;
  height: 100%;
  transition: width .6s;
}

.report-bar-value {
  color: var(--text-primary);
  text-align: right;
  flex-shrink: 0;
  width: 4.5rem;
  font-size: .75rem;
  font-weight: 700;
}

.report-rail-grid {
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: .75rem;
  display: grid;
}

.report-rail-card {
  background: rgba(255, 255, 255, .03);
  border: 1px solid rgba(255, 255, 255, .06);
  border-radius: 8px;
  flex-direction: column;
  gap: .25rem;
  padding: .875rem;
  display: flex;
}

.report-rail-icon {
  font-size: 1.5rem;
}

.report-rail-name {
  color: var(--text-primary);
  font-size: .75rem;
  font-weight: 600;
}

.report-rail-amount {
  color: var(--green);
  font-size: .9rem;
  font-weight: 800;
}

.report-rail-count {
  color: var(--text-secondary);
  font-size: .65rem;
}

.report-export-row {
  border: 1px solid var(--border-default);
  background: rgba(255, 255, 255, .02);
  border-radius: 10px;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.report-export-text {
  flex: 1;
}

.mkt-controls {
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem;
  margin-bottom: 1.25rem;
  display: flex;
}

.mkt-search {
  flex: 1;
  min-width: 200px;
}

.mkt-filters {
  flex-wrap: wrap;
  gap: .4rem;
  display: flex;
}

.mkt-emerg-toggle {
  color: var(--text-secondary);
  cursor: pointer;
  white-space: nowrap;
  align-items: center;
  gap: .4rem;
  font-size: .75rem;
  display: flex;
}

.mkt-grid {
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 1rem;
  display: grid;
}

.mkt-card {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  border-radius: 12px;
  flex-direction: column;
  gap: .5rem;
  padding: 1.25rem;
  display: flex;
  position: relative;
  overflow: hidden;
}

.mkt-emerg-chip {
  color: #f87171;
  background: rgba(239, 68, 68, .12);
  border-radius: 0 10px 0 6px;
  padding: .2rem .6rem;
  font-size: .6rem;
  font-weight: 700;
  position: absolute;
  top: 0;
  right: 0;
}

.mkt-card-icon {
  font-size: 2.25rem;
}

.mkt-card-name {
  color: var(--text-primary);
  font-size: .85rem;
  font-weight: 700;
}

.mkt-card-trade {
  color: var(--text-secondary);
  font-size: .7rem;
}

.mkt-card-rating {
  color: #fbbf24;
  font-size: .75rem;
}

.mkt-status {
  color: var(--text-secondary);
  text-transform: uppercase;
  background: rgba(255, 255, 255, .06);
  border-radius: 999px;
  padding: .18rem .55rem;
  font-size: .6rem;
  font-weight: 700;
}

.mkt-status--active {
  color: #4ade80;
  background: rgba(34, 197, 94, .1);
}

.mkt-card-actions {
  margin-top: .5rem;
}

.syndic-notice {
  color: var(--text-secondary);
  background: rgba(10, 132, 255, .05);
  border: 1px solid rgba(10, 132, 255, .15);
  border-radius: 8px;
  align-items: center;
  gap: .875rem;
  margin-bottom: 1.25rem;
  padding: .75rem 1rem;
  font-size: .78rem;
  display: flex;
}

.syndic-notice-icon {
  flex-shrink: 0;
  font-size: 1rem;
}

.syndic-group {
  margin-bottom: 1.5rem;
}

.syndic-group-title {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-secondary);
  margin-bottom: .75rem;
  font-size: .72rem;
  font-weight: 700;
}

.syndic-card {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  border-radius: 10px;
  flex-direction: column;
  gap: .875rem;
  padding: 1rem;
  transition: border-color .15s;
  display: flex;
}

.syndic-card--on {
  background: rgba(34, 197, 94, .03);
  border-color: rgba(34, 197, 94, .3);
}

.syndic-card-top {
  align-items: flex-start;
  gap: .75rem;
  display: flex;
}

.syndic-card-icon {
  flex-shrink: 0;
  font-size: 1.5rem;
}

.syndic-card-meta {
  flex-direction: column;
  gap: .15rem;
  display: flex;
}

.syndic-card-name {
  color: var(--text-primary);
  font-size: .82rem;
  font-weight: 700;
}

.syndic-card-desc {
  color: var(--text-secondary);
  font-size: .68rem;
  line-height: 1.4;
}

.syndic-card-toggle-row {
  align-items: center;
  gap: .625rem;
  display: flex;
}

.syndic-toggle-wrap {
  flex-shrink: 0;
  width: 2.25rem;
  height: 1.25rem;
  display: inline-block;
  position: relative;
}

.syndic-toggle-input {
  opacity: 0;
  width: 0;
  height: 0;
  position: absolute;
}

.syndic-toggle-track {
  cursor: pointer;
  background: rgba(255, 255, 255, .1);
  border-radius: 999px;
  transition: background .2s;
  position: absolute;
  inset: 0;
}

.syndic-toggle-input:checked + .syndic-toggle-track {
  background: #4ade80;
}

.syndic-toggle-track:after {
  content: "";
  background: var(--surface-container-lowest);
  border-radius: 50%;
  width: 1rem;
  height: 1rem;
  transition: transform .2s;
  position: absolute;
  top: 3px;
  left: 3px;
}

.syndic-toggle-input:checked + .syndic-toggle-track:after {
  transform: translateX(1rem);
}

.syndic-toggle-input:disabled + .syndic-toggle-track {
  opacity: .4;
  cursor: not-allowed;
}

.syndic-toggle-label {
  color: var(--text-secondary);
  font-size: .68rem;
}

.wholesale-kanban {
  gap: .75rem;
  padding-bottom: .5rem;
  display: flex;
  overflow-x: auto;
}

.wholesale-column {
  flex-direction: column;
  flex: 1;
  gap: .625rem;
  min-width: 200px;
  display: flex;
}

.wholesale-col-header {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  border-radius: 8px 8px 0 0;
  justify-content: space-between;
  align-items: center;
  padding: .75rem .875rem;
  display: flex;
}

.wholesale-col-title {
  color: var(--text-primary);
  font-size: .75rem;
  font-weight: 700;
}

.wholesale-col-count {
  color: var(--text-secondary);
  background: rgba(255, 255, 255, .08);
  border-radius: 999px;
  padding: .1rem .45rem;
  font-size: .68rem;
}

.folio-layout .wholesale-col-count {
  background: var(--surface-container-high);
  color: var(--on-surface);
  text-align: center;
  font-variant-numeric: tabular-nums;
  min-width: 1.35rem;
}

.wholesale-col-body {
  flex-direction: column;
  gap: .5rem;
  min-height: 8rem;
  display: flex;
}

.wholesale-empty {
  color: var(--text-secondary);
  text-align: center;
  padding: 1.5rem 0;
  font-size: .72rem;
}

.wholesale-card {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  border-radius: 8px;
  flex-direction: column;
  gap: .3rem;
  padding: .875rem;
  display: flex;
}

.wholesale-card-addr {
  color: var(--text-primary);
  font-size: .78rem;
  font-weight: 700;
}

.wholesale-card-kv {
  justify-content: space-between;
  display: flex;
}

.wholesale-card-k {
  color: var(--text-secondary);
  font-size: .65rem;
}

.wholesale-card-v {
  color: var(--text-primary);
  font-size: .72rem;
  font-weight: 700;
}

.wholesale-card-date {
  color: var(--text-secondary);
  margin-top: .2rem;
  font-size: .62rem;
}

.mao-result-card {
  text-align: center;
  background: rgba(34, 197, 94, .06);
  border: 1px solid rgba(34, 197, 94, .2);
  border-radius: 10px;
  padding: 1rem;
}

.mao-result-label {
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: .68rem;
}

.mao-result-value {
  color: #4ade80;
  margin: .25rem 0;
  font-size: 2rem;
  font-weight: 900;
}

.mao-result-detail {
  color: var(--text-secondary);
  font-size: .72rem;
}

.listing-preview-badge {
  color: #fbbf24;
  background: rgba(251, 191, 36, .1);
  border: 1px solid rgba(251, 191, 36, .25);
  border-radius: 999px;
  padding: .25rem .75rem;
  font-size: .7rem;
  font-weight: 700;
}

.listing-preview-wrap {
  max-width: 42rem;
}

.listing-preview-card {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  border-radius: 14px;
  overflow: hidden;
}

.listing-preview-photo {
  background: linear-gradient(135deg, rgba(10, 132, 255, .12), rgba(94, 92, 230, .2));
  justify-content: center;
  align-items: center;
  height: 14rem;
  display: flex;
  position: relative;
}

.listing-preview-photo-icon {
  font-size: 5rem;
}

.listing-preview-photo-overlay {
  position: absolute;
  top: .875rem;
  left: .875rem;
}

.listing-live-chip {
  color: #4ade80;
  background: rgba(34, 197, 94, .15);
  border-radius: 999px;
  padding: .25rem .75rem;
  font-size: .68rem;
  font-weight: 700;
}

.listing-draft-chip {
  color: #94a3b8;
  background: rgba(148, 163, 184, .15);
  border-radius: 999px;
  padding: .25rem .75rem;
  font-size: .68rem;
  font-weight: 700;
}

.listing-preview-body {
  flex-direction: column;
  gap: .625rem;
  padding: 1.5rem;
  display: flex;
}

.listing-preview-price {
  color: var(--cobalt);
  font-size: 1.5rem;
  font-weight: 900;
}

.listing-preview-headline {
  color: var(--text-primary);
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
}

.listing-preview-address {
  color: var(--text-secondary);
  font-size: .78rem;
}

.listing-spec-row {
  flex-wrap: wrap;
  gap: .4rem;
  display: flex;
}

.listing-spec-chip {
  color: var(--text-secondary);
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 999px;
  padding: .2rem .6rem;
  font-size: .68rem;
  font-weight: 600;
}

.listing-preview-desc {
  color: var(--text-secondary);
  font-size: .82rem;
  line-height: 1.6;
}

.listing-preview-cta-inner {
  background: rgba(255, 255, 255, .03);
  border: 1px solid rgba(255, 255, 255, .06);
  border-radius: 8px;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: .875rem;
  display: flex;
}

.listing-no-listing {
  text-align: center;
  padding: 3rem;
}

.listing-no-icon {
  margin-bottom: .5rem;
  font-size: 2.5rem;
}

.listing-no-sub {
  color: var(--text-secondary);
  margin-top: .25rem;
  font-size: .75rem;
}

.acct-plan-card {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .35);
  border-radius: 12px;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.25rem;
  padding: 1.25rem 1.5rem;
  display: flex;
}

.acct-plan-badge {
  color: var(--on-surface);
  align-items: center;
  gap: .4rem;
  font-size: .88rem;
  font-weight: 800;
  display: flex;
}

.acct-plan-desc {
  color: var(--text-secondary);
  margin-top: .25rem;
  font-size: .75rem;
}

.acct-section {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  border-radius: 10px;
  margin-bottom: 1rem;
  padding: 1.25rem;
}

.acct-section--danger {
  border-color: rgba(239, 68, 68, .2);
}

.acct-section-title {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-secondary);
  margin-bottom: .875rem;
  font-size: .72rem;
  font-weight: 700;
}

.acct-pm-row {
  flex-direction: column;
  gap: .75rem;
  display: flex;
}

.acct-pm-card {
  background: rgba(255, 255, 255, .02);
  border: 1px solid rgba(255, 255, 255, .05);
  border-radius: 8px;
  align-items: center;
  gap: .875rem;
  padding: .875rem;
  display: flex;
}

.acct-pm-icon {
  flex-shrink: 0;
  font-size: 1.5rem;
}

.acct-pm-label {
  color: var(--text-primary);
  font-size: .82rem;
  font-weight: 600;
}

.acct-pm-sub {
  color: var(--text-secondary);
  font-size: .7rem;
}

.acct-pm-card .btn {
  flex-shrink: 0;
  margin-left: auto;
}

.acct-danger-row {
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  display: flex;
}

.alert-saved-toast {
  color: #4ade80;
  background: rgba(34, 197, 94, .1);
  border: 1px solid rgba(34, 197, 94, .25);
  border-radius: 8px;
  align-items: center;
  gap: .5rem;
  margin-bottom: 1rem;
  padding: .5rem .875rem;
  font-size: .78rem;
  font-weight: 600;
  display: inline-flex;
}

.alerts-section {
  margin-bottom: 1.25rem;
}

.alerts-section-title {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-secondary);
  margin-bottom: .75rem;
  font-size: .72rem;
  font-weight: 700;
}

.alerts-type-list {
  background: var(--bg-surface-high);
  border: 1px solid var(--border-default);
  border-radius: 10px;
  flex-direction: column;
  gap: 0;
  display: flex;
  overflow: hidden;
}

.alerts-type-row {
  border-bottom: 1px solid rgba(255, 255, 255, .04);
  align-items: center;
  gap: .875rem;
  padding: .875rem 1rem;
  display: flex;
}

.alerts-type-row:last-child {
  border-bottom: none;
}

.alerts-type-icon {
  flex-shrink: 0;
  font-size: 1.2rem;
}

.alerts-type-body {
  flex: 1;
}

.alerts-type-title {
  color: var(--text-primary);
  font-size: .82rem;
  font-weight: 600;
}

.alerts-type-desc {
  color: var(--text-secondary);
  margin-top: .1rem;
  font-size: .7rem;
}

.owner-readonly-badge {
  color: var(--cobalt);
  background: rgba(10, 132, 255, .12);
  border-radius: 9999px;
  padding: .2rem .6rem;
  font-size: .7rem;
}

.owner-section {
  margin-top: 1.5rem;
}

.owner-section-title {
  color: var(--on-surface-variant);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: .75rem;
  font-size: .75rem;
  font-weight: 700;
}

.owner-chip {
  border-radius: 9999px;
  padding: .2rem .5rem;
  font-size: .72rem;
  font-weight: 600;
}

.owner-chip--green {
  color: #4ade80;
  background: rgba(34, 197, 94, .15);
}

.owner-chip--amber {
  color: #fbbf24;
  background: rgba(251, 191, 36, .15);
}

.owner-chip--red {
  color: #f87171;
  background: rgba(248, 113, 113, .15);
}

.owner-chip--grey {
  color: #94a3b8;
  background: rgba(148, 163, 184, .1);
}

.owner-table-wrap {
  background: rgba(255, 255, 255, .04);
  border-radius: .75rem;
  overflow-x: auto;
}

.owner-tabs {
  gap: .5rem;
  margin-bottom: 1rem;
  display: flex;
}

.owner-tab {
  color: var(--on-surface-variant);
  cursor: pointer;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: .5rem;
  padding: .45rem 1rem;
  font-size: .85rem;
  transition: all .15s;
}

.owner-tab--active {
  color: var(--cobalt);
  background: rgba(10, 132, 255, .15);
  border-color: rgba(10, 132, 255, .4);
}

.owner-prop-header {
  background: rgba(255, 255, 255, .04);
  border-radius: .75rem;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.owner-prop-icon {
  font-size: 2rem;
}

.owner-prop-name {
  font-size: 1.1rem;
  font-weight: 700;
}

.owner-prop-meta {
  color: var(--on-surface-variant);
  font-size: .8rem;
}

.owner-cases-header {
  align-items: center;
  gap: .75rem;
  display: flex;
}

.owner-cases-count {
  color: var(--on-surface-variant);
  font-size: .8rem;
}

.dist-summary-card {
  background: linear-gradient(135deg, rgba(34, 197, 94, .1), rgba(10, 132, 255, .08));
  border: 1px solid rgba(34, 197, 94, .2);
  border-radius: 1rem;
  margin-bottom: 1.5rem;
  padding: 1.5rem;
}

.dist-summary-header {
  justify-content: space-between;
  align-items: center;
  margin-bottom: .5rem;
  display: flex;
}

.dist-summary-label {
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--on-surface-variant);
  font-size: .75rem;
}

.dist-summary-amount {
  color: #4ade80;
  font-size: 2.5rem;
  font-weight: 800;
}

.dist-summary-breakdown {
  grid-template-columns: repeat(3, 1fr);
  gap: .75rem;
  margin-top: 1rem;
  display: grid;
}

.dist-breakdown-item {
  flex-direction: column;
  gap: .2rem;
  display: flex;
}

.dist-breakdown-label {
  color: var(--on-surface-variant);
  font-size: .72rem;
}

.dist-breakdown-value {
  font-size: .95rem;
  font-weight: 600;
}

.dist-prop-list {
  flex-direction: column;
  gap: .75rem;
  display: flex;
}

.dist-prop-row {
  background: rgba(255, 255, 255, .04);
  border-radius: .75rem;
  align-items: center;
  gap: 1rem;
  padding: .85rem 1rem;
  display: flex;
}

.dist-prop-icon {
  font-size: 1.4rem;
}

.dist-prop-info {
  flex: 1;
  min-width: 0;
}

.dist-prop-name {
  font-size: .9rem;
  font-weight: 600;
}

.dist-prop-addr {
  color: var(--on-surface-variant);
  font-size: .78rem;
}

.dist-prop-amounts {
  text-align: right;
  font-size: .78rem;
}

.dist-prop-gross, .dist-prop-fee {
  color: var(--on-surface-variant);
}

.dist-prop-net {
  font-size: .9rem;
}

.pmc-client-header {
  background: rgba(255, 255, 255, .04);
  border-radius: .75rem;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.pmc-client-avatar {
  width: 2.5rem;
  height: 2.5rem;
  color: var(--cobalt);
  background: rgba(10, 132, 255, .2);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  font-size: 1.1rem;
  font-weight: 700;
  display: flex;
}

.pmc-client-name {
  font-size: 1.1rem;
  font-weight: 700;
}

.pmc-client-meta {
  color: var(--on-surface-variant);
  font-size: .8rem;
}

.pmc-portfolio-grid {
  flex-wrap: wrap;
  gap: .75rem;
  display: flex;
}

.pmc-portfolio-chip {
  background: rgba(255, 255, 255, .05);
  border-radius: .5rem;
  align-items: center;
  gap: .5rem;
  padding: .5rem .75rem;
  display: flex;
}

.pmc-portfolio-chip-icon {
  font-size: 1.1rem;
}

.pmc-action-row {
  flex-wrap: wrap;
  gap: .75rem;
  display: flex;
}

.pmc-action-card {
  color: inherit;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: .75rem;
  flex-direction: column;
  align-items: center;
  gap: .4rem;
  padding: 1rem 1.5rem;
  text-decoration: none;
  transition: background .15s;
  display: flex;
}

.pmc-action-card:hover {
  background: rgba(255, 255, 255, .09);
}

.pmc-action-icon {
  font-size: 1.6rem;
}

.pmc-dispatch-count {
  color: var(--on-surface-variant);
  margin-bottom: .75rem;
  font-size: .8rem;
}

.pmc-queue-list {
  flex-direction: column;
  gap: .75rem;
  display: flex;
}

.pmc-queue-card {
  background: rgba(255, 255, 255, .04);
  border-radius: .75rem;
  align-items: flex-start;
  gap: 1rem;
  padding: .85rem 1rem;
  display: flex;
}

.pmc-queue-card-left {
  flex: 1;
  min-width: 0;
}

.pmc-queue-card-right {
  flex-direction: column;
  align-items: flex-end;
  gap: .5rem;
  display: flex;
}

.pmc-queue-subject {
  margin: .3rem 0;
  font-size: .9rem;
  font-weight: 600;
}

.pmc-queue-meta {
  color: var(--on-surface-variant);
  font-size: .76rem;
}

.maint-priority-badge {
  border-radius: 9999px;
  padding: .2rem .5rem;
  font-size: .72rem;
  font-weight: 600;
}

.maint-priority--urgent {
  color: #f87171;
  background: rgba(248, 113, 113, .15);
}

.maint-priority--high {
  color: #fb923c;
  background: rgba(249, 115, 22, .15);
}

.maint-priority--medium {
  color: #fbbf24;
  background: rgba(251, 191, 36, .15);
}

.maint-priority--low {
  color: #94a3b8;
  background: rgba(148, 163, 184, .1);
}

.pmc-stmt-toolbar {
  align-items: center;
  gap: 1rem;
  margin-bottom: .75rem;
  display: flex;
}

.pmc-stmt-selected-count {
  color: var(--on-surface-variant);
  font-size: .8rem;
}

.pmc-stmt-list {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.pmc-stmt-row {
  cursor: pointer;
  background: rgba(255, 255, 255, .04);
  border: 1.5px solid rgba(0, 0, 0, 0);
  border-radius: .75rem;
  align-items: center;
  gap: .75rem;
  padding: .75rem 1rem;
  transition: all .15s;
  display: flex;
}

.pmc-stmt-row--selected {
  background: rgba(10, 132, 255, .1);
  border-color: rgba(10, 132, 255, .35);
}

.pmc-stmt-check {
  color: var(--cobalt);
  width: 1.4rem;
  font-size: 1.2rem;
}

.pmc-stmt-info {
  flex: 1;
  min-width: 0;
}

.pmc-stmt-name {
  font-size: .9rem;
  font-weight: 600;
}

.pmc-stmt-email {
  color: var(--on-surface-variant);
  font-size: .76rem;
}

.pmc-stmt-metrics {
  color: var(--on-surface-variant);
  gap: 1rem;
  font-size: .76rem;
  display: flex;
}

.str-upcoming-list {
  flex-direction: column;
  gap: .6rem;
  display: flex;
}

.str-upcoming-card {
  background: rgba(255, 255, 255, .04);
  border-radius: .75rem;
  align-items: center;
  gap: 1rem;
  padding: .75rem 1rem;
  display: flex;
}

.str-upcoming-dates {
  flex: 1;
  align-items: center;
  gap: .5rem;
  display: flex;
}

.str-upcoming-date-in, .str-upcoming-date-out {
  font-size: .85rem;
  font-weight: 600;
}

.str-upcoming-arrow {
  color: var(--on-surface-variant);
}

.str-upcoming-meta {
  align-items: center;
  gap: .75rem;
  display: flex;
}

.str-upcoming-nights {
  color: var(--on-surface-variant);
  font-size: .78rem;
}

.str-upcoming-price {
  font-size: .9rem;
  font-weight: 700;
}

.str-quick-row {
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1.5rem;
  display: flex;
}

.str-quick-card {
  color: inherit;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: .75rem;
  flex-direction: column;
  align-items: center;
  gap: .4rem;
  padding: .85rem 1.25rem;
  font-size: .85rem;
  text-decoration: none;
  transition: background .15s;
  display: flex;
}

.str-quick-card:hover {
  background: rgba(255, 255, 255, .09);
}

.str-cal-nav {
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
  display: flex;
}

.str-cal-month-label {
  text-align: center;
  min-width: 12rem;
  font-size: 1rem;
  font-weight: 700;
}

.str-cal-grid {
  background: rgba(255, 255, 255, .04);
  border-radius: .75rem;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
  padding: 4px;
  display: grid;
  overflow: hidden;
}

.str-cal-dow {
  text-align: center;
  text-transform: uppercase;
  color: var(--on-surface-variant);
  padding: .4rem;
  font-size: .72rem;
  font-weight: 700;
}

.str-cal-cell {
  aspect-ratio: 1;
  cursor: default;
  border-radius: .35rem;
  flex-direction: column;
  align-items: flex-start;
  padding: .3rem .4rem;
  transition: background .15s;
  display: flex;
  position: relative;
}

.str-cal-cell--empty {
  opacity: 0;
  pointer-events: none;
}

.str-cal-cell--booked {
  outline: 1.5px solid rgba(255, 255, 255, .1);
}

.str-cal-day-num {
  font-size: .75rem;
  font-weight: 600;
}

.str-cal-booking-dot {
  align-self: center;
  margin-top: auto;
  font-size: .8rem;
}

.str-cal-legend {
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: .75rem;
  display: flex;
}

.str-cal-legend-item {
  border-radius: .35rem;
  padding: .2rem .55rem;
  font-size: .72rem;
}

.str-listing-form {
  flex-direction: column;
  gap: 1rem;
  display: flex;
}

.str-listing-status-row {
  border-bottom: 1px solid rgba(255, 255, 255, .07);
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem;
  margin-bottom: .5rem;
  padding: .75rem 0;
  display: flex;
}

.str-listing-textarea {
  resize: vertical;
  min-height: 10rem;
}

.str-review-list {
  flex-direction: column;
  gap: 1rem;
  display: flex;
}

.str-review-card {
  background: rgba(255, 255, 255, .04);
  border-radius: .75rem;
  padding: 1rem 1.25rem;
}

.str-review-header {
  flex-wrap: wrap;
  align-items: flex-start;
  gap: .75rem;
  margin-bottom: .75rem;
  display: flex;
}

.str-review-avatar {
  width: 2.25rem;
  height: 2.25rem;
  color: var(--cobalt);
  background: rgba(10, 132, 255, .2);
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  font-weight: 700;
  display: flex;
}

.str-review-name {
  font-size: .9rem;
  font-weight: 600;
}

.str-review-date {
  color: var(--on-surface-variant);
  font-size: .75rem;
}

.str-review-stars {
  margin-left: auto;
}

.str-review-comment {
  color: var(--on-surface);
  margin-bottom: .75rem;
  font-size: .88rem;
  font-style: italic;
  line-height: 1.6;
}

.str-review-response {
  background: rgba(10, 132, 255, .07);
  border-left: 3px solid rgba(10, 132, 255, .4);
  border-radius: 0 .5rem .5rem 0;
  margin-top: .5rem;
  padding: .65rem .85rem;
}

.str-review-response-label {
  color: var(--cobalt);
  margin-bottom: .25rem;
  font-size: .72rem;
  font-weight: 700;
}

.str-review-response-text {
  color: var(--on-surface-variant);
  font-size: .84rem;
}

.str-msgs-layout {
  grid-template-columns: 18rem 1fr;
  gap: 1rem;
  height: calc(100vh - 14rem);
  min-height: 24rem;
  display: grid;
}

.str-msgs-sidebar {
  background: rgba(255, 255, 255, .03);
  border-radius: .75rem;
  flex-direction: column;
  display: flex;
  overflow-y: auto;
}

.str-msgs-sidebar-title {
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--on-surface-variant);
  padding: .75rem 1rem .4rem;
  font-size: .72rem;
  font-weight: 700;
}

.str-conv-list {
  flex-direction: column;
  display: flex;
}

.str-conv-row {
  cursor: pointer;
  border-bottom: 1px solid rgba(255, 255, 255, .04);
  align-items: center;
  gap: .75rem;
  padding: .65rem 1rem;
  transition: background .12s;
  display: flex;
}

.str-conv-row:hover {
  background: rgba(255, 255, 255, .05);
}

.str-conv-row--active {
  background: rgba(10, 132, 255, .1);
}

.str-conv-avatar {
  width: 2rem;
  height: 2rem;
  color: var(--cobalt);
  background: rgba(10, 132, 255, .2);
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  font-size: .85rem;
  font-weight: 700;
  display: flex;
}

.str-conv-info {
  flex: 1;
  min-width: 0;
}

.str-conv-name {
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .85rem;
  font-weight: 600;
  overflow: hidden;
}

.str-conv-last {
  color: var(--on-surface-variant);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .75rem;
  overflow: hidden;
}

.str-conv-unread {
  background: var(--cobalt);
  color: #fff;
  border-radius: 9999px;
  flex-shrink: 0;
  padding: .1rem .4rem;
  font-size: .68rem;
  font-weight: 700;
}

.str-msgs-thread {
  background: rgba(255, 255, 255, .03);
  border-radius: .75rem;
  flex-direction: column;
  display: flex;
  overflow: hidden;
}

.str-msgs-empty {
  color: var(--on-surface-variant);
  text-align: center;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: center;
  gap: .5rem;
  padding: 2rem;
  display: flex;
}

.str-msgs-empty-icon {
  font-size: 2.5rem;
}

.str-thread-messages {
  flex-direction: column;
  flex: 1;
  gap: .5rem;
  padding: .75rem 1rem;
  display: flex;
  overflow-y: auto;
}

.str-msg-bubble {
  border-radius: .75rem;
  max-width: 70%;
  padding: .55rem .85rem;
  font-size: .85rem;
  line-height: 1.5;
}

.str-msg-bubble--host {
  background: rgba(10, 132, 255, .2);
  align-self: flex-end;
}

.str-msg-bubble--guest {
  background: rgba(255, 255, 255, .07);
  align-self: flex-start;
}

.str-msg-meta {
  color: var(--on-surface-variant);
  margin-bottom: .2rem;
  font-size: .68rem;
}

.str-thread-compose {
  border-top: 1px solid rgba(255, 255, 255, .07);
  gap: .75rem;
  padding: .75rem 1rem;
  display: flex;
}

.str-thread-input {
  resize: none;
  color: inherit;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: .5rem;
  flex: 1;
  padding: .5rem .75rem;
  font-size: .88rem;
}

.syndic-channel-grid {
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
  display: grid;
}

.pricing-listing-grid {
  flex-wrap: wrap;
  gap: .75rem;
  margin-bottom: .5rem;
  display: flex;
}

.pricing-listing-card {
  background: rgba(255, 255, 255, .05);
  border-radius: .75rem;
  flex-direction: column;
  gap: .3rem;
  min-width: 10rem;
  padding: .85rem 1.1rem;
  display: flex;
}

.pricing-listing-type {
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--on-surface-variant);
  font-size: .75rem;
}

.pricing-listing-base {
  color: #4ade80;
  font-size: 1.3rem;
  font-weight: 800;
}

.pricing-rules-list {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.pricing-rule-row {
  background: rgba(255, 255, 255, .04);
  border-radius: .75rem;
  align-items: center;
  gap: 1rem;
  padding: .75rem 1rem;
  display: flex;
}

.pricing-rule-info {
  flex: 1;
  min-width: 0;
}

.pricing-rule-name {
  font-size: .88rem;
  font-weight: 600;
}

.pricing-rule-trigger {
  color: var(--on-surface-variant);
  font-size: .76rem;
}

.pricing-rule-category {
  color: var(--on-surface-variant);
  background: rgba(255, 255, 255, .07);
  border-radius: 9999px;
  padding: .2rem .5rem;
  font-size: .72rem;
}

.apply-layout {
  background: var(--surface);
  flex-direction: column;
  align-items: center;
  min-height: 100vh;
  padding: 2rem 1rem;
  display: flex;
}

.apply-header {
  text-align: center;
  margin-bottom: 2rem;
}

.apply-logo {
  color: var(--cobalt);
  font-size: 1.8rem;
  font-weight: 800;
}

.apply-subtitle {
  color: var(--on-surface-variant);
  margin-top: .25rem;
  font-size: 1rem;
}

.apply-property-id {
  color: var(--on-surface-variant);
  margin-top: .25rem;
  font-family: monospace;
  font-size: .75rem;
}

.apply-card {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 1rem;
  width: 100%;
  max-width: 36rem;
  padding: 1.5rem;
}

.apply-section-title {
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--on-surface-variant);
  margin-bottom: 1rem;
  font-size: .8rem;
  font-weight: 700;
}

.apply-two-col {
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  display: grid;
}

.apply-consent-row {
  cursor: pointer;
  align-items: flex-start;
  gap: .75rem;
  margin: .75rem 0;
  font-size: .85rem;
  line-height: 1.5;
  display: flex;
}

.wiz-steps {
  align-items: center;
  gap: .25rem;
  display: flex;
}

.wiz-step {
  color: var(--on-surface-variant);
  white-space: nowrap;
  background: rgba(255, 255, 255, .07);
  border-radius: 9999px;
  padding: .3rem .7rem;
  font-size: .72rem;
}

.wiz-step--active {
  color: var(--cobalt);
  background: rgba(10, 132, 255, .2);
  font-weight: 600;
}

.wiz-step-divider {
  background: rgba(255, 255, 255, .1);
  flex: 1;
  min-width: .5rem;
  height: 1px;
}

.wiz-card {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: 1rem;
  flex-direction: column;
  gap: 1rem;
  padding: 1.5rem;
  display: flex;
}

.wiz-footer {
  justify-content: space-between;
  margin-top: .5rem;
  display: flex;
}

.wiz-confirm-table {
  background: rgba(255, 255, 255, .03);
  border-radius: .75rem;
  flex-direction: column;
  gap: .4rem;
  padding: .85rem 1rem;
  display: flex;
}

.wiz-confirm-row {
  justify-content: space-between;
  gap: 1rem;
  font-size: .85rem;
  display: flex;
}

.wiz-confirm-row span {
  color: var(--on-surface-variant);
}

.wiz-confirm-desc {
  flex-direction: column;
  gap: .25rem;
  display: flex;
}

.wiz-success-card {
  text-align: center;
  background: rgba(34, 197, 94, .08);
  border: 1px solid rgba(34, 197, 94, .2);
  border-radius: 1rem;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding: 2rem;
  display: flex;
}

.wiz-success-icon {
  color: #4ade80;
  font-size: 3rem;
}

.wiz-success-title {
  font-size: 1.4rem;
  font-weight: 800;
}

.wiz-success-sub {
  color: var(--on-surface-variant);
  max-width: 28rem;
  font-size: .9rem;
  line-height: 1.6;
}

.wiz-success-actions {
  flex-wrap: wrap;
  justify-content: center;
  gap: .75rem;
  margin-top: .5rem;
  display: flex;
}

.wiz-error-banner {
  color: #f87171;
  background: rgba(248, 113, 113, .12);
  border: 1px solid rgba(248, 113, 113, .25);
  border-radius: .5rem;
  padding: .65rem .9rem;
  font-size: .85rem;
}

.alert-saved-toast {
  color: #4ade80;
  background: rgba(34, 197, 94, .12);
  border: 1px solid rgba(34, 197, 94, .25);
  border-radius: .5rem;
  margin-bottom: .75rem;
  padding: .6rem 1rem;
  font-size: .85rem;
}

.triage-category-grid {
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: .6rem;
  display: grid;
}

.triage-cat-btn {
  cursor: pointer;
  color: inherit;
  background: rgba(255, 255, 255, .05);
  border: 1.5px solid rgba(255, 255, 255, .08);
  border-radius: .75rem;
  flex-direction: column;
  align-items: center;
  gap: .35rem;
  padding: .75rem .5rem;
  font-size: .8rem;
  transition: all .15s;
  display: flex;
}

.triage-cat-btn:hover {
  background: rgba(255, 255, 255, .09);
}

.triage-cat-btn--active {
  color: var(--cobalt);
  background: rgba(10, 132, 255, .15);
  border-color: rgba(10, 132, 255, .4);
}

.triage-cat-icon {
  font-size: 1.6rem;
}

.triage-urgency-row {
  gap: .5rem;
  display: flex;
}

.triage-urgency-btn {
  cursor: pointer;
  color: inherit;
  background: rgba(255, 255, 255, .05);
  border: 1.5px solid rgba(255, 255, 255, .08);
  border-radius: .5rem;
  flex: 1;
  padding: .5rem;
  font-size: .8rem;
  transition: all .15s;
}

.triage-urgency-btn--active {
  color: var(--cobalt);
  background: rgba(10, 132, 255, .15);
  border-color: rgba(10, 132, 255, .4);
}

.listing-no-listing {
  color: var(--on-surface-variant);
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: .75rem;
  padding: 3rem;
  display: flex;
}

.listing-no-icon {
  font-size: 3rem;
}

.listing-no-title {
  color: var(--on-surface);
  font-size: 1.2rem;
  font-weight: 700;
}

.lead-portal-card {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 1rem;
  width: 100%;
  max-width: 32rem;
  padding: 1.5rem;
}

.lead-hero {
  margin-bottom: 1.25rem;
}

.lead-hero-type {
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--on-surface-variant);
  margin-bottom: .3rem;
  font-size: .72rem;
}

.lead-hero-name {
  font-size: 1.5rem;
  font-weight: 800;
}

.lead-hero-address {
  color: var(--on-surface-variant);
  margin: .25rem 0;
  font-size: .88rem;
}

.lead-hero-meta {
  flex-wrap: wrap;
  gap: .5rem;
  margin: .6rem 0;
  display: flex;
}

.lead-hero-chip {
  background: rgba(255, 255, 255, .07);
  border-radius: 9999px;
  padding: .25rem .6rem;
  font-size: .78rem;
}

.lead-hero-chip--green {
  color: #4ade80;
  background: rgba(34, 197, 94, .12);
  font-weight: 700;
}

.lead-avail {
  color: var(--cobalt);
  margin-top: .25rem;
  font-size: .8rem;
}

.lead-campaign-badge {
  color: var(--amber);
  margin-top: .35rem;
  font-size: .76rem;
}

.lead-agent-row {
  background: rgba(255, 255, 255, .04);
  border-radius: .75rem;
  align-items: center;
  gap: .75rem;
  margin-bottom: 1rem;
  padding: .75rem;
  display: flex;
}

.lead-agent-avatar {
  width: 2.25rem;
  height: 2.25rem;
  color: var(--cobalt);
  background: rgba(10, 132, 255, .2);
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  font-weight: 700;
  display: flex;
}

.lead-agent-name {
  font-size: .9rem;
  font-weight: 600;
}

.lead-agent-phone {
  color: var(--on-surface-variant);
  font-size: .78rem;
}

.lead-action-tabs {
  gap: .5rem;
  margin-bottom: 1rem;
  display: flex;
}

.lead-action-tab {
  cursor: pointer;
  color: inherit;
  background: rgba(255, 255, 255, .05);
  border: 1.5px solid rgba(255, 255, 255, .08);
  border-radius: .5rem;
  flex: 1;
  padding: .5rem;
  font-size: .82rem;
  transition: all .15s;
}

.lead-action-tab--active {
  color: var(--cobalt);
  background: rgba(10, 132, 255, .15);
  border-color: rgba(10, 132, 255, .4);
  font-weight: 600;
}

.lead-schedule-note {
  color: var(--amber);
  background: rgba(251, 191, 36, .08);
  border-radius: .5rem;
  margin: .5rem 0;
  padding: .5rem .75rem;
  font-size: .8rem;
}

.lead-success {
  text-align: center;
  padding: 1.5rem 0;
}

.lead-success-title {
  margin-top: .5rem;
  font-size: 1.1rem;
  font-weight: 700;
}

.inquiry-confirm-name {
  color: var(--cobalt);
  margin: .75rem 0 .25rem;
  font-size: 1rem;
  font-weight: 600;
}

.inquiry-confirm-property {
  margin: .4rem 0;
}

.inquiry-confirm-ref {
  color: var(--on-surface-variant);
  margin-top: .5rem;
  font-size: .75rem;
}

.inquiry-confirm-ref code {
  color: var(--on-surface);
  font-family: monospace;
}

.inquiry-confirm-next {
  text-align: left;
  background: rgba(255, 255, 255, .04);
  border-radius: .75rem;
  margin-top: 1.25rem;
  padding: 1rem 1.25rem;
}

.inquiry-confirm-next-title {
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--on-surface-variant);
  margin-bottom: .75rem;
  font-size: .75rem;
  font-weight: 700;
}

.inquiry-confirm-step {
  align-items: flex-start;
  gap: .75rem;
  margin-bottom: .5rem;
  font-size: .85rem;
  display: flex;
}

.inquiry-confirm-step-num {
  width: 1.4rem;
  height: 1.4rem;
  color: var(--cobalt);
  background: rgba(10, 132, 255, .2);
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  font-size: .72rem;
  font-weight: 700;
  display: flex;
}

.job-link-header {
  margin-bottom: 1rem;
}

.job-link-category {
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--on-surface-variant);
  font-size: .72rem;
}

.job-link-subject {
  margin: .2rem 0 .4rem;
  font-size: 1.3rem;
  font-weight: 800;
}

.job-link-meta {
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem;
  font-size: .82rem;
  display: flex;
}

.job-link-address {
  color: var(--on-surface-variant);
}

.job-link-details {
  background: rgba(255, 255, 255, .04);
  border-radius: .75rem;
  flex-direction: column;
  gap: .4rem;
  margin-bottom: 1rem;
  padding: .75rem 1rem;
  display: flex;
}

.job-link-detail-row {
  justify-content: space-between;
  font-size: .85rem;
  display: flex;
}

.job-link-detail-label {
  color: var(--on-surface-variant);
}

.job-link-detail-val {
  font-weight: 600;
}

.job-link-desc {
  margin-bottom: 1rem;
}

.job-link-desc-label {
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--on-surface-variant);
  margin-bottom: .35rem;
  font-size: .75rem;
  font-weight: 700;
}

.job-link-desc-text {
  font-size: .88rem;
  line-height: 1.6;
}

.job-link-action-section {
  margin-top: .5rem;
}

.job-link-cta-row {
  gap: .75rem;
  margin-top: .75rem;
  display: flex;
}

.job-link-cta-row .btn {
  flex: 1;
  justify-content: center;
}

.job-link-response-banner {
  border: 1.5px solid;
  border-radius: .75rem;
  align-items: center;
  gap: 1rem;
  margin-top: .75rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.pmc-markets-grid {
  flex-wrap: wrap;
  gap: .5rem;
  display: flex;
}

.pmc-market-chip {
  cursor: pointer;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 9999px;
  align-items: center;
  gap: .4rem;
  padding: .3rem .7rem;
  font-size: .8rem;
  transition: background .12s;
  display: flex;
}

.pmc-market-chip:hover {
  background: rgba(255, 255, 255, .09);
}

.pmc-market-chip input {
  accent-color: var(--cobalt);
}

.pmc-onboard-platform-info {
  background: rgba(10, 132, 255, .07);
  border: 1px solid rgba(10, 132, 255, .2);
  border-radius: .75rem;
  margin: .75rem 0;
  padding: .85rem 1rem;
}

.pmc-onboard-plan-badge {
  color: var(--cobalt);
  font-size: .8rem;
  font-weight: 700;
}

.g27-dash {
  flex-direction: column;
  gap: 0;
  display: flex;
}

.g27-template-bar {
  align-items: center;
  gap: .75rem;
  margin-bottom: 1rem;
  display: flex;
}

.g27-template-label {
  color: var(--on-surface-variant);
  font-size: .8rem;
  font-weight: 600;
}

.g27-template-select {
  max-width: 20rem;
}

.g27-dim-table {
  flex-direction: column;
  gap: .4rem;
  display: flex;
}

.g27-dim-row {
  background: rgba(255, 255, 255, .03);
  border-radius: .5rem;
  align-items: center;
  gap: 1rem;
  padding: .5rem .75rem;
  display: flex;
}

.g27-dim-name {
  flex: 1;
  font-size: .85rem;
}

.g27-table-header {
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--on-surface-variant);
  grid-template-columns: 4rem 1fr 10rem 6rem;
  gap: .75rem;
  padding: .5rem .75rem;
  font-size: .72rem;
  font-weight: 700;
  display: grid;
}

.g27-leader-table {
  flex-direction: column;
  gap: .3rem;
  display: flex;
}

.g27-leader-row {
  background: rgba(255, 255, 255, .03);
  border-radius: .5rem;
  grid-template-columns: 3rem 1fr 8rem 4rem;
  align-items: center;
  gap: .75rem;
  padding: .5rem .75rem;
  font-size: .85rem;
  display: grid;
}

.g27-rank-badge {
  color: var(--cobalt);
  font-size: .88rem;
  font-weight: 800;
}

.g27-entity-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
  overflow: hidden;
}

.g27-anom-list {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.g27-anom-row {
  background: rgba(248, 113, 113, .06);
  border: 1px solid rgba(248, 113, 113, .15);
  border-radius: .65rem;
  align-items: flex-start;
  gap: .75rem;
  padding: .6rem .85rem;
  display: flex;
}

.g27-anom-icon {
  color: #f87171;
  flex-shrink: 0;
  margin-top: .1rem;
  font-size: 1rem;
}

.g27-anom-body {
  flex: 1;
  min-width: 0;
}

.g27-anom-entity {
  font-size: .85rem;
  font-weight: 600;
}

.g27-anom-msg {
  color: var(--on-surface-variant);
  margin-top: .15rem;
  font-size: .78rem;
}

.g27-anom-right {
  flex-direction: column;
  flex-shrink: 0;
  align-items: flex-end;
  gap: .3rem;
  display: flex;
}

.g27-rules-table {
  flex-direction: column;
  gap: .3rem;
  display: flex;
}

.g27-rules-header {
  grid-template-columns: 3rem 1fr 1fr 1fr 3rem 3rem !important;
}

.g27-rule-row {
  background: rgba(255, 255, 255, .03);
  border-radius: .5rem;
  grid-template-columns: 3rem 1fr 1fr 1fr 3rem 3rem;
  align-items: center;
  gap: .75rem;
  padding: .6rem .75rem;
  font-size: .82rem;
  display: grid;
}

.g27-rule-priority {
  color: var(--cobalt);
  font-weight: 700;
}

.g27-rule-trigger {
  text-transform: capitalize;
}

.g27-rule-cond {
  color: var(--on-surface-variant);
  font-family: monospace;
  font-size: .75rem;
}

.g27-rule-action {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.g27-surface-list {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.g27-surface-row {
  background: rgba(255, 255, 255, .04);
  border-radius: .75rem;
  align-items: center;
  gap: 1rem;
  padding: .85rem 1rem;
  display: flex;
}

.g27-surface-info {
  flex: 1;
  min-width: 0;
}

.g27-surface-label {
  font-size: .9rem;
  font-weight: 600;
}

.g27-surface-desc {
  color: var(--on-surface-variant);
  margin-top: .15rem;
  font-size: .78rem;
}

.listings-standalone {
  background: var(--surface);
  min-height: 100vh;
}

.listings-embed {
  background: none;
}

.listings-hero {
  text-align: center;
  background: linear-gradient(135deg, rgba(10, 132, 255, .12), rgba(34, 197, 94, .06));
  border-bottom: 1px solid rgba(255, 255, 255, .06);
  padding: 3rem 1.5rem 2rem;
}

.listings-hero-title {
  font-size: 2rem;
  font-weight: 800;
}

.listings-hero-sub {
  color: var(--on-surface-variant);
  margin-top: .4rem;
  font-size: 1rem;
}

.listings-filter-bar {
  z-index: 20;
  backdrop-filter: blur(8px);
  background: rgba(255, 255, 255, .03);
  border-bottom: 1px solid rgba(255, 255, 255, .06);
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  padding: 1rem 1.25rem;
  display: flex;
  position: sticky;
  top: 0;
}

.listings-filter-group {
  flex-direction: column;
  display: flex;
}

.listings-filter-input {
  min-width: 10rem;
}

.listings-search-btn {
  flex-shrink: 0;
}

.listings-result-count {
  color: var(--on-surface-variant);
  padding: .75rem 1.25rem .25rem;
  font-size: .82rem;
}

.listings-loading {
  text-align: center;
  color: var(--on-surface-variant);
  padding: 3rem;
}

.listings-grid {
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
  padding: 1rem 1.25rem;
  display: grid;
}

.listing-card {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 1rem;
  flex-direction: column;
  transition: box-shadow .15s;
  display: flex;
  position: relative;
  overflow: hidden;
}

.listing-card:hover {
  box-shadow: 0 4px 24px rgba(0, 0, 0, .25);
}

.listing-card--featured {
  border-color: rgba(251, 191, 36, .3);
  box-shadow: 0 0 0 1px rgba(251, 191, 36, .15);
}

.listing-card--unavail {
  opacity: .6;
}

.listing-card-featured-badge {
  color: #fbbf24;
  background: rgba(251, 191, 36, .2);
  border-radius: 9999px;
  padding: .2rem .5rem;
  font-size: .7rem;
  font-weight: 700;
  position: absolute;
  top: .5rem;
  left: .5rem;
}

.listing-card-unavail-overlay {
  color: #f87171;
  z-index: 2;
  background: rgba(0, 0, 0, .45);
  justify-content: center;
  align-items: center;
  font-size: .8rem;
  font-weight: 600;
  display: flex;
  position: absolute;
  inset: 0;
}

.listing-card-photo {
  background: linear-gradient(135deg, rgba(10, 132, 255, .1), rgba(139, 92, 246, .08));
  justify-content: center;
  align-items: center;
  height: 9rem;
  display: flex;
  position: relative;
}

.listing-card-type-icon {
  font-size: 3.5rem;
}

.listing-card-body {
  flex-direction: column;
  flex: 1;
  gap: .3rem;
  padding: .75rem 1rem;
  display: flex;
}

.listing-card-address {
  font-size: .92rem;
  font-weight: 600;
}

.listing-card-city {
  color: var(--on-surface-variant);
  font-size: .78rem;
}

.listing-card-meta {
  flex-wrap: wrap;
  gap: .35rem;
  display: flex;
}

.listing-meta-chip {
  background: rgba(255, 255, 255, .07);
  border-radius: 9999px;
  padding: .2rem .45rem;
  font-size: .72rem;
}

.listing-card-amenities {
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .25rem;
  display: flex;
}

.listing-amenity-chip {
  color: var(--cobalt);
  background: rgba(10, 132, 255, .1);
  border-radius: 9999px;
  padding: .15rem .4rem;
  font-size: .7rem;
}

.listing-card-footer {
  border-top: 1px solid rgba(255, 255, 255, .06);
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  padding: .65rem 1rem;
  display: flex;
}

.listing-card-rent {
  color: #4ade80;
  font-size: 1rem;
  font-weight: 800;
}

.listing-card-avail {
  color: var(--on-surface-variant);
  font-size: .75rem;
}

.listing-card-actions {
  gap: .4rem;
  display: flex;
}

.listings-empty {
  color: var(--on-surface-variant);
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: .75rem;
  padding: 3rem;
  display: flex;
}

.listings-empty-icon {
  font-size: 3rem;
}

.listings-empty-title {
  color: var(--on-surface);
  font-size: 1.1rem;
  font-weight: 700;
}

.listings-pagination {
  justify-content: center;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  display: flex;
}

.listings-page-info {
  color: var(--on-surface-variant);
  font-size: .85rem;
}

.listings-footer {
  text-align: center;
  color: var(--on-surface-variant);
  border-top: 1px solid rgba(255, 255, 255, .06);
  padding: 1.5rem;
  font-size: .8rem;
}

.listings-footer-link {
  color: var(--cobalt);
  text-decoration: none;
}

.str-filter-bar {
  background: rgba(10, 132, 255, .04);
}

.str-listing-card-photo {
  background: linear-gradient(135deg, rgba(139, 92, 246, .15), rgba(10, 132, 255, .1));
  height: 11rem;
}

.str-listing-icon {
  font-size: 4rem;
}

.str-listing-tag {
  color: #a78bfa;
  background: rgba(139, 92, 246, .2);
  border-radius: 9999px;
  padding: .2rem .5rem;
  font-size: .68rem;
  font-weight: 700;
  position: absolute;
  top: .5rem;
  right: .5rem;
}

.str-listing-name {
  font-size: 1rem !important;
}

.str-listing-beds {
  color: var(--on-surface-variant);
  font-size: .78rem;
}

.str-listing-rating {
  align-items: center;
  gap: .35rem;
  margin-top: .2rem;
  display: flex;
}

.str-stars {
  color: #fbbf24;
  font-size: .85rem;
}

.str-rev-count {
  color: var(--on-surface-variant);
}

.ni-domain-preview {
  color: var(--cobalt);
  margin-top: .35rem;
  font-size: .78rem;
  font-weight: 600;
}

.ni-usecase-grid {
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
  display: grid;
}

.ni-usecase-card {
  cursor: pointer;
  text-align: center;
  background: rgba(255, 255, 255, .04);
  border: 1.5px solid rgba(255, 255, 255, .08);
  border-radius: .75rem;
  flex-direction: column;
  align-items: center;
  gap: .4rem;
  padding: 1.25rem .75rem;
  transition: all .15s;
  display: flex;
}

.ni-usecase-card:hover {
  background: rgba(255, 255, 255, .08);
}

.ni-usecase-card--active {
  background: rgba(10, 132, 255, .12);
  border-color: rgba(10, 132, 255, .4);
}

.ni-usecase-icon {
  font-size: 2rem;
}

.ni-usecase-label {
  font-size: .92rem;
  font-weight: 700;
}

.ni-usecase-desc {
  color: var(--on-surface-variant);
  font-size: .75rem;
}

.ni-plan-grid {
  grid-template-columns: repeat(3, 1fr);
  gap: .65rem;
  display: grid;
}

.ni-plan-card {
  cursor: pointer;
  background: rgba(255, 255, 255, .04);
  border: 1.5px solid rgba(255, 255, 255, .08);
  border-radius: .75rem;
  flex-direction: column;
  gap: .35rem;
  padding: .85rem 1rem;
  transition: all .15s;
  display: flex;
}

.ni-plan-card:hover {
  background: rgba(255, 255, 255, .08);
}

.ni-plan-card--active {
  background: rgba(10, 132, 255, .12);
  border-color: rgba(10, 132, 255, .4);
}

.ni-plan-name {
  font-size: .9rem;
  font-weight: 700;
}

.ni-plan-price {
  color: #4ade80;
  font-size: 1.2rem;
  font-weight: 800;
}

.ni-plan-desc {
  color: var(--on-surface-variant);
  font-size: .72rem;
  line-height: 1.4;
}

.ni-signup-next {
  text-align: left;
  flex-direction: column;
  gap: .5rem;
  margin: 1rem 0;
  display: flex;
}

.ni-signup-next-step {
  align-items: center;
  gap: .65rem;
  font-size: .85rem;
  display: flex;
}

.pmc-map-filters {
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem;
  margin-bottom: 1rem;
  display: flex;
}

.pmc-map-status-filters {
  flex-wrap: wrap;
  gap: .4rem;
  display: flex;
}

.pmc-map-status-btn {
  cursor: pointer;
  color: var(--on-surface);
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 9999px;
  align-items: center;
  gap: .35rem;
  padding: .3rem .75rem;
  font-size: .78rem;
  transition: all .15s;
  display: flex;
}

.pmc-map-status-btn:hover {
  background: rgba(255, 255, 255, .09);
}

.pmc-map-status-btn--active {
  background: rgba(var(--status-color, 255,255,255),.15);
  border-color: var(--status-color, rgba(255, 255, 255, .2));
}

.pmc-map-dot {
  border-radius: 50%;
  flex-shrink: 0;
  width: .45rem;
  height: .45rem;
}

.pmc-map-container {
  background: rgba(255, 255, 255, .02);
  border: 1.5px dashed rgba(255, 255, 255, .1);
  border-radius: .75rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .3rem;
  height: 10rem;
  margin-bottom: 1rem;
  display: flex;
}

.pmc-map-tile-placeholder {
  flex-direction: column;
  align-items: center;
  gap: .35rem;
  display: flex;
}

.pmc-map-tile-icon {
  font-size: 2.5rem;
}

.pmc-map-tile-label {
  color: var(--on-surface-variant);
  font-size: .85rem;
  font-style: italic;
}

.pmc-map-grid {
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: .75rem;
  display: grid;
}

.pmc-map-card {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: .75rem;
  flex-direction: column;
  gap: .5rem;
  padding: .85rem 1rem;
  display: flex;
}

.pmc-map-card-header {
  align-items: center;
  gap: .6rem;
  display: flex;
}

.pmc-map-card-icon {
  flex-shrink: 0;
  font-size: 1.4rem;
}

.pmc-map-card-addr {
  flex: 1;
  min-width: 0;
}

.pmc-map-card-street {
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .88rem;
  font-weight: 600;
  overflow: hidden;
}

.pmc-map-card-meta {
  flex-wrap: wrap;
  gap: .4rem;
  display: flex;
}

.pmc-map-meta-chip {
  background: rgba(255, 255, 255, .05);
  border-radius: 9999px;
  align-items: center;
  gap: .2rem;
  padding: .15rem .4rem;
  font-size: .75rem;
  display: flex;
}

.pmc-meta-icon {
  font-size: .75rem;
}

.str-listing-index-grid {
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1rem;
  display: grid;
}

.str-listing-index-card {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 1rem;
  flex-direction: column;
  transition: box-shadow .15s;
  display: flex;
  overflow: hidden;
}

.str-listing-index-card:hover {
  box-shadow: 0 4px 24px rgba(0, 0, 0, .25);
}

.str-listing-index-photo {
  background: linear-gradient(135deg, rgba(139, 92, 246, .15), rgba(10, 132, 255, .1));
  justify-content: center;
  align-items: center;
  height: 8rem;
  display: flex;
  position: relative;
}

.str-listing-index-icon {
  font-size: 3.5rem;
}

.str-listing-index-body {
  flex-direction: column;
  flex: 1;
  gap: .3rem;
  padding: .75rem 1rem;
  display: flex;
}

.str-listing-index-name {
  font-size: .95rem;
  font-weight: 700;
}

.str-listing-index-addr {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.str-listing-index-rating {
  align-items: center;
  gap: .3rem;
  display: flex;
}

.str-listing-index-stats {
  grid-template-columns: repeat(3, 1fr);
  gap: .3rem;
  margin: .4rem 0;
  display: grid;
}

.str-listing-stat {
  background: rgba(255, 255, 255, .04);
  border-radius: .4rem;
  flex-direction: column;
  gap: .1rem;
  padding: .35rem .4rem;
  display: flex;
}

.str-listing-stat-label {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--on-surface-variant);
  font-size: .65rem;
}

.str-listing-stat-val {
  font-size: .85rem;
  font-weight: 700;
}

.str-listing-index-checkin {
  margin-top: .25rem;
}

.str-listing-index-footer {
  border-top: 1px solid rgba(255, 255, 255, .06);
  padding: .6rem 1rem;
}

.settings-page .form-input, .settings-page .form-select {
  background: var(--surface-container-lowest);
  width: 100%;
  color: var(--on-surface);
  border: 1px solid rgba(198, 198, 205, .55);
  border-radius: .5rem;
  padding: .65rem .75rem;
  font-family: inherit;
  font-size: .9rem;
}

.settings-page .form-input:focus, .settings-page .form-select:focus {
  border-color: var(--on-surface);
  outline: none;
}

.settings-page .btn {
  cursor: pointer;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .5rem;
  align-items: center;
  gap: .35rem;
  padding: .5rem .9rem;
  font-size: .8125rem;
  font-weight: 600;
  display: inline-flex;
}

.settings-page .btn-primary {
  color: #fff;
  background: var(--navy);
}

.settings-page .btn-ghost {
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  border-color: rgba(198, 198, 205, .45);
}

.settings-page .btn-sm {
  padding: .35rem .7rem;
}

.settings-section {
  max-width: 44rem;
}

.settings-avatar-row {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: .75rem;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.25rem;
  padding: 1rem;
  display: flex;
}

.settings-avatar {
  background: linear-gradient(135deg,var(--cobalt),#8b5cf6);
  color: #fff;
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 3.5rem;
  height: 3.5rem;
  font-size: 1.1rem;
  font-weight: 800;
  display: flex;
}

.settings-avatar-name {
  font-size: .95rem;
  font-weight: 700;
}

.settings-avatar-email {
  margin-top: .1rem;
}

.settings-notif-table {
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: .75rem;
  flex-direction: column;
  display: flex;
  overflow: hidden;
}

.settings-notif-header {
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--on-surface-variant);
  background: rgba(255, 255, 255, .03);
  border-bottom: 1px solid rgba(255, 255, 255, .06);
  grid-template-columns: 1fr 5rem 5rem 5rem;
  gap: .5rem;
  padding: .6rem 1rem;
  font-size: .72rem;
  font-weight: 700;
  display: grid;
}

.settings-notif-row {
  border-top: 1px solid rgba(255, 255, 255, .05);
  grid-template-columns: 1fr 5rem 5rem 5rem;
  align-items: center;
  gap: .5rem;
  padding: .75rem 1rem;
  display: grid;
}

.settings-notif-row:first-of-type {
  border-top: none;
}

.settings-notif-label {
  font-size: .88rem;
  font-weight: 600;
}

.settings-notif-desc {
  margin-top: .15rem;
}

.settings-session-list {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.settings-session-row {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: .65rem;
  align-items: center;
  gap: .75rem;
  padding: .65rem .85rem;
  display: flex;
}

.settings-session-icon {
  flex-shrink: 0;
  font-size: 1.4rem;
}

.settings-session-info {
  flex: 1;
  min-width: 0;
}

.settings-session-device {
  align-items: center;
  gap: .3rem;
  font-size: .88rem;
  font-weight: 600;
  display: flex;
}

.settings-theme-grid {
  grid-template-columns: repeat(3, 1fr);
  gap: .65rem;
  max-width: 20rem;
  margin-top: .4rem;
  display: grid;
}

.settings-theme-card {
  cursor: pointer;
  background: rgba(255, 255, 255, .04);
  border: 1.5px solid rgba(255, 255, 255, .1);
  border-radius: .65rem;
  justify-content: center;
  align-items: center;
  height: 3.5rem;
  font-size: .85rem;
  font-weight: 600;
  transition: all .15s;
  display: flex;
}

.settings-theme-card:hover {
  background: rgba(255, 255, 255, .09);
}

.settings-theme-card--active {
  color: var(--cobalt);
  background: rgba(10, 132, 255, .12);
  border-color: rgba(10, 132, 255, .4);
}

.folio-mktg {
  --mk-bg: #090f1a;
  --mk-surface: #0f1825;
  --mk-surface2: #141e2e;
  --mk-border: rgba(255, 255, 255, .08);
  --mk-text: #e8edf5;
  --mk-muted: #8a97b0;
  --mk-accent: #ff6b35;
  --mk-green: #06d6a0;
  --mk-blue: #3b82f6;
  --mk-radius: 12px;
  --mk-section-py: 6rem;
  background: var(--mk-bg);
  color: var(--mk-text);
  min-height: 100vh;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
  overflow-x: hidden;
}

.mktg-nav {
  z-index: 100;
  -webkit-backdrop-filter: blur(16px);
  background: rgba(9, 15, 26, .7);
  border-bottom: 1px solid rgba(255, 255, 255, .06);
  transition: background .3s, border-color .3s;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
}

.mktg-nav--scrolled {
  background: rgba(9, 15, 26, .92);
  border-bottom-color: rgba(255, 255, 255, .1);
}

.mktg-nav-inner {
  align-items: center;
  gap: 1.25rem;
  max-width: 1400px;
  margin: 0 auto;
  padding: .75rem 2rem;
  display: flex;
}

.mktg-nav-logo {
  color: var(--mk-text);
  letter-spacing: -.02em;
  align-items: center;
  gap: .5rem;
  font-size: 1.15rem;
  font-weight: 800;
  text-decoration: none;
  display: flex;
}

.mktg-logo-mark {
  background: linear-gradient(135deg, var(--mk-accent), #ff9a3c);
  color: #fff;
  border-radius: 7px;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  font-size: .9rem;
  font-weight: 900;
  display: flex;
}

.mktg-nav-links {
  align-items: center;
  gap: 1rem;
  margin-left: .5rem;
  display: flex;
}

.mktg-nav-links > a {
  color: var(--mk-muted);
  white-space: nowrap;
  border-radius: 6px;
  padding: .4rem .5rem;
  font-size: .83rem;
  text-decoration: none;
  transition: color .15s, background .15s;
}

.mktg-nav-links > a:hover {
  color: var(--mk-text);
}

.mktg-nav-broker-link {
  opacity: .65;
  border-left: 1px solid var(--mk-border);
  white-space: nowrap;
  margin-left: .5rem;
  padding-left: 1rem;
  transition: opacity .15s;
  color: var(--mk-muted) !important;
  font-size: .83rem !important;
}

.mktg-nav-broker-link:hover {
  opacity: 1;
  color: var(--mk-text) !important;
}

.mktg-nav-actions {
  align-items: center;
  gap: .75rem;
  margin-left: auto;
  display: flex;
}

details.mktg-nav-role-dropdown {
  flex-shrink: 0;
  align-items: center;
  display: inline-flex;
  position: relative;
}

details.mktg-nav-role-dropdown > summary {
  cursor: pointer;
  color: var(--mk-muted);
  white-space: nowrap;
  -webkit-user-select: none;
  user-select: none;
  border-radius: 6px;
  align-items: center;
  gap: .3rem;
  padding: .4rem .5rem;
  font-size: .83rem;
  font-weight: 500;
  list-style: none;
  transition: color .15s, background .15s;
  display: flex;
}

details.mktg-nav-role-dropdown > summary::-webkit-details-marker {
  display: none;
}

details.mktg-nav-role-dropdown > summary::marker {
  display: none;
}

details.mktg-nav-role-dropdown > summary:hover {
  color: var(--mk-text);
  background: rgba(255, 255, 255, .05);
}

.mktg-nav-role-arrow {
  align-items: center;
  transition: transform .2s;
  display: inline-flex;
}

details.mktg-nav-role-dropdown[open] .mktg-nav-role-arrow {
  transform: rotate(180deg);
}

.mktg-nav-role-panel {
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  z-index: 200;
  background: rgba(10, 18, 40, .97);
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 12px;
  min-width: 260px;
  padding: .5rem;
  display: none;
  position: absolute;
  top: calc(100% + .6rem);
  left: 50%;
  transform: translateX(-50%);
  box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
}

details.mktg-nav-role-dropdown[open] .mktg-nav-role-panel {
  flex-direction: column;
  animation: .15s roleDropIn;
  display: flex;
}

@keyframes roleDropIn {
  from {
    opacity: 0;
    transform: translateX(-50%) translateY(-6px);
  }

  to {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
}

.mktg-nav-role-item {
  color: var(--mk-muted);
  white-space: normal;
  border-radius: 8px;
  align-items: flex-start;
  gap: .75rem;
  padding: .7rem .85rem;
  font-size: .85rem;
  font-weight: 500;
  text-decoration: none;
  transition: background .12s, color .12s, transform .1s ease-out;
  display: flex;
}

.mktg-nav-role-item:hover {
  color: var(--mk-text);
  background: rgba(255, 255, 255, .07);
}

.mktg-nav-role-item:active {
  transform: scale(.98);
}

.mktg-nav-role-item--active {
  color: #06d6a0;
  background: rgba(6, 214, 160, .06);
  border-left: 2px solid #06d6a0;
  padding-left: calc(.85rem - 2px);
}

.mktg-nav-role-item--active:hover {
  color: #06d6a0;
  background: rgba(6, 214, 160, .1);
}

.mktg-nav-role-icon {
  flex-shrink: 0;
  font-size: 1.05rem;
  line-height: 1.35;
}

.mktg-nav-role-copy {
  flex-direction: column;
  gap: .15rem;
  min-width: 0;
  display: flex;
}

.mktg-nav-role-title {
  color: var(--mk-text);
  letter-spacing: -.01em;
  font-size: .88rem;
  font-weight: 600;
  line-height: 1.25;
  display: block;
}

.mktg-nav-role-item--active .mktg-nav-role-title {
  color: #06d6a0;
}

.mktg-nav-role-sub {
  color: var(--mk-muted);
  letter-spacing: 0;
  font-size: .72rem;
  font-weight: 400;
  line-height: 1.35;
  display: block;
}

@media (prefers-reduced-motion: reduce) {
  details.mktg-nav-role-dropdown[open] .mktg-nav-role-panel {
    animation: none;
  }

  .mktg-btn-accent:hover, .mktg-btn-accent:active, .mktg-nav-role-item:active {
    transform: none;
  }
}

.mktg-btn-founders {
  color: rgba(255, 200, 60, .85);
  white-space: nowrap;
  letter-spacing: .01em;
  background: rgba(255, 200, 60, .05);
  border: 1px solid rgba(255, 200, 60, .28);
  border-radius: 8px;
  padding: .4rem .85rem;
  font-size: .82rem;
  font-weight: 600;
  text-decoration: none;
  transition: background .15s, border-color .15s, color .15s;
}

.mktg-btn-founders:hover {
  color: #ffc83c;
  background: rgba(255, 200, 60, .12);
  border-color: rgba(255, 200, 60, .5);
}

.mktg-btn-ghost {
  border: 1px solid var(--mk-border);
  color: var(--mk-muted);
  border-radius: 8px;
  padding: .45rem 1rem;
  font-size: .85rem;
  font-weight: 500;
  text-decoration: none;
  transition: border-color .15s, color .15s;
}

.mktg-btn-ghost:hover {
  color: var(--mk-text);
  border-color: rgba(255, 255, 255, .2);
}

.mktg-btn-signin {
  color: var(--mk-text);
  white-space: nowrap;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 8px;
  align-items: center;
  gap: .35rem;
  padding: .45rem 1rem;
  font-size: .85rem;
  font-weight: 600;
  text-decoration: none;
  transition: background .15s, border-color .15s, color .15s;
  display: inline-flex;
}

.mktg-btn-signin:hover {
  color: #fff;
  background: rgba(255, 255, 255, .12);
  border-color: rgba(255, 255, 255, .3);
}

.lang-switcher {
  flex-shrink: 0;
  position: relative;
}

.lang-switcher-btn {
  color: var(--mk-muted);
  cursor: pointer;
  white-space: nowrap;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 7px;
  align-items: center;
  gap: .3rem;
  padding: .35rem .65rem;
  font-size: .78rem;
  transition: background .15s, border-color .15s, color .15s;
  display: flex;
}

.lang-switcher-btn:hover {
  color: var(--mk-text);
  background: rgba(255, 255, 255, .1);
  border-color: rgba(255, 255, 255, .22);
}

.lang-switcher-dropdown {
  z-index: 200;
  -webkit-backdrop-filter: blur(20px);
  background: rgba(15, 24, 42, .95);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 10px;
  flex-direction: column;
  gap: .1rem;
  min-width: 160px;
  padding: .35rem;
  display: flex;
  position: absolute;
  top: calc(100% + .5rem);
  right: 0;
  box-shadow: 0 12px 40px rgba(0, 0, 0, .45);
}

.lang-option {
  width: 100%;
  color: var(--mk-muted);
  cursor: pointer;
  text-align: left;
  background: none;
  border: none;
  border-radius: 7px;
  align-items: center;
  gap: .6rem;
  padding: .55rem .75rem;
  font-size: .85rem;
  transition: background .12s, color .12s;
  display: flex;
}

.lang-option:hover {
  color: var(--mk-text);
  background: rgba(255, 255, 255, .08);
}

.lang-option--active {
  color: #fff;
  background: rgba(6, 214, 160, .1);
}

.lang-option--active:hover {
  background: rgba(6, 214, 160, .15);
}

.mktg-btn-accent {
  background: linear-gradient(135deg, var(--mk-accent), #ff8a4c);
  color: #fff;
  letter-spacing: -.01em;
  cursor: pointer;
  white-space: nowrap;
  border: none;
  border-radius: 8px;
  align-items: center;
  gap: .4rem;
  padding: .55rem 1.35rem;
  font-size: .875rem;
  font-weight: 700;
  text-decoration: none;
  transition: transform .1s ease-out, box-shadow .15s, filter .15s;
  display: inline-flex;
  box-shadow: 0 2px 10px rgba(255, 107, 53, .35);
}

.mktg-btn-accent:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(255, 107, 53, .45);
}

.mktg-btn-accent:active {
  transform: scale(.97);
  box-shadow: 0 2px 8px rgba(255, 107, 53, .3);
}

.mktg-nav-actions .mktg-btn-accent {
  padding: .55rem 1.25rem;
  font-size: .88rem;
  box-shadow: 0 2px 12px rgba(255, 107, 53, .4);
}

.mktg-btn-lg {
  border-radius: 10px;
  padding: .75rem 1.75rem;
  font-size: .95rem;
}

.mktg-btn-full {
  justify-content: center;
  width: 100%;
}

.mktg-btn-green {
  background: var(--mk-green);
  color: #0a1628;
  cursor: pointer;
  border: none;
  border-radius: 8px;
  align-items: center;
  gap: .5rem;
  padding: .5rem 1.2rem;
  font-size: .875rem;
  font-weight: 700;
  transition: transform .15s, box-shadow .15s;
  display: inline-flex;
}

.mktg-btn-green:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(6, 214, 160, .3);
}

.mktg-btn-green:disabled {
  opacity: .6;
  cursor: default;
  transform: none;
}

.mktg-hero {
  background: var(--mk-bg);
  align-items: center;
  min-height: 100vh;
  padding: 7rem 2rem 5rem;
  display: flex;
  position: relative;
  overflow: visible;
}

.mktg-hero-grid-overlay {
  pointer-events: none;
  background-image: linear-gradient(rgba(255, 255, 255, .024) 1px, rgba(0, 0, 0, 0) 1px), linear-gradient(90deg, rgba(255, 255, 255, .024) 1px, rgba(0, 0, 0, 0) 1px);
  background-size: 60px 60px;
  position: absolute;
  inset: 0;
  -webkit-mask-image: radial-gradient(80% 80% at 50% 40%, #000 50%, rgba(0, 0, 0, 0) 100%);
  mask-image: radial-gradient(80% 80% at 50% 40%, #000 50%, rgba(0, 0, 0, 0) 100%);
}

.mktg-hero:after {
  content: "";
  pointer-events: none;
  background: radial-gradient(rgba(255, 107, 53, .12) 0%, rgba(0, 0, 0, 0) 70%);
  width: 800px;
  height: 600px;
  position: absolute;
  top: -200px;
  left: 50%;
  transform: translateX(-50%);
}

.mktg-hero-inner {
  z-index: 1;
  text-align: center;
  max-width: 780px;
  margin: 0 auto;
  position: relative;
}

.mktg-eyebrow {
  color: #ffaa80;
  letter-spacing: .06em;
  text-transform: uppercase;
  background: rgba(255, 107, 53, .1);
  border: 1px solid rgba(255, 107, 53, .25);
  border-radius: 99px;
  align-items: center;
  gap: .4rem;
  margin-bottom: 1.75rem;
  padding: .35rem .9rem;
  font-size: .78rem;
  font-weight: 600;
  display: inline-flex;
}

.mktg-hero-h1 {
  letter-spacing: -.035em;
  color: #fff;
  margin-bottom: 1.5rem;
  font-size: clamp(2.5rem, 6vw, 4rem);
  font-weight: 900;
  line-height: 1.08;
}

.mktg-h1-accent {
  background: linear-gradient(135deg, var(--mk-accent), #ff9a3c);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
}

.mktg-hero-sub {
  color: var(--mk-muted);
  max-width: 600px;
  margin: 0 auto 2.5rem;
  font-size: 1.1rem;
  line-height: 1.7;
}

#waitlist-wrap, .mktg-wl-wrap {
  max-width: 580px;
  margin: 0 auto;
  scroll-margin-top: 80px;
}

.mktg-wl-step {
  transition: opacity .2s;
}

.mktg-wl-step.hidden {
  display: none;
}

.mktg-wl-details {
  padding-bottom: 2rem;
}

.mktg-wl-row {
  flex-wrap: nowrap;
  align-items: stretch;
  gap: .5rem;
  display: flex;
}

.mktg-wl-row > .mktg-btn-accent {
  flex: none;
}

.mktg-wl-row > .mktg-btn-accent:hover, .mktg-wl-row > .mktg-btn-accent:active {
  transform: none;
}

.mktg-wl-email {
  border: 1px solid var(--mk-border);
  min-width: 0;
  color: var(--mk-text);
  background: rgba(255, 255, 255, .06);
  border-radius: 10px;
  outline: none;
  flex: auto;
  padding: .8rem 1.1rem;
  font-size: .95rem;
  transition: border-color .15s, background .15s;
}

@media (width <= 540px) {
  .mktg-wl-row {
    flex-direction: column;
  }

  .mktg-wl-row > .mktg-btn-accent {
    justify-content: center;
    width: 100%;
  }
}

.mktg-wl-email:focus {
  border-color: var(--mk-accent);
  background: rgba(255, 255, 255, .09);
}

.mktg-wl-err {
  color: #f87171;
  text-align: left;
  margin-top: .4rem;
  font-size: .83rem;
}

.mktg-wl-count-line {
  color: var(--mk-muted);
  margin-top: .9rem;
  font-size: .82rem;
}

.mktg-wl-count {
  color: var(--mk-green);
  font-weight: 700;
}

.mktg-wl-signin-hint {
  color: var(--mk-muted);
  text-align: center;
  margin-top: .55rem;
  font-size: .82rem;
}

.mktg-wl-signin-link {
  color: var(--mk-text);
  border-bottom: 1px solid rgba(255, 255, 255, .25);
  font-weight: 600;
  text-decoration: none;
  transition: color .15s, border-color .15s;
}

.mktg-wl-signin-link:hover {
  color: #fff;
  border-color: rgba(255, 255, 255, .6);
}

.mktg-wl-card {
  border: 1px solid var(--mk-border);
  text-align: left;
  background: rgba(255, 255, 255, .04);
  border-radius: 16px;
  flex-direction: column;
  gap: 1.25rem;
  margin-bottom: 1rem;
  padding: 1.75rem;
  display: flex;
}

.mktg-wl-card-head {
  color: var(--mk-muted);
  font-size: .9rem;
  font-weight: 500;
}

.mktg-wl-field {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.mktg-wl-label {
  color: var(--mk-muted);
  letter-spacing: .03em;
  font-size: .83rem;
  font-weight: 600;
}

.mktg-wl-optional {
  opacity: .7;
  font-weight: 400;
}

.mktg-pill-row {
  flex-wrap: wrap;
  gap: .5rem;
  display: flex;
}

.mktg-pill {
  border: 1px solid var(--mk-border);
  color: var(--mk-muted);
  cursor: pointer;
  background: none;
  border-radius: 99px;
  padding: .4rem .85rem;
  font-size: .82rem;
  font-weight: 500;
  transition: all .15s;
}

.mktg-pill:hover {
  color: var(--mk-text);
  border-color: rgba(255, 255, 255, .2);
}

.mktg-pill.selected {
  color: #ffaa80;
  background: rgba(255, 107, 53, .15);
  border-color: rgba(255, 107, 53, .5);
  font-weight: 600;
}

.mktg-wl-select, .mktg-wl-input {
  border: 1px solid var(--mk-border);
  color: var(--mk-text);
  background: rgba(255, 255, 255, .05);
  border-radius: 8px;
  outline: none;
  width: 100%;
  padding: .6rem .85rem;
  font-size: .88rem;
  transition: border-color .15s;
}

.mktg-wl-select:focus, .mktg-wl-input:focus {
  border-color: var(--mk-accent);
}

.mktg-wl-success {
  text-align: center;
  background: rgba(6, 214, 160, .05);
  border: 1px solid rgba(6, 214, 160, .2);
  border-radius: 16px;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding: 2rem;
  display: flex;
}

.mktg-success-h3 {
  color: #fff;
  font-size: 1.4rem;
  font-weight: 800;
}

.mktg-success-sub {
  color: var(--mk-muted);
  max-width: 380px;
  font-size: .9rem;
  line-height: 1.6;
}

.mktg-success-card {
  border: 1px solid var(--mk-border);
  background: rgba(255, 255, 255, .05);
  border-radius: 12px;
  align-items: center;
  gap: 2rem;
  width: 100%;
  padding: 1.25rem 2rem;
  display: flex;
}

.mktg-success-label {
  color: var(--mk-muted);
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: .75rem;
}

.mktg-success-num {
  color: var(--mk-green);
  font-size: 2rem;
  font-weight: 900;
}

.mktg-success-div {
  background: var(--mk-border);
  flex-shrink: 0;
  width: 1px;
  height: 50px;
}

.mktg-success-share-text {
  color: var(--mk-muted);
  margin-bottom: .65rem;
  font-size: .82rem;
  line-height: 1.4;
}

.mktg-success-share-btn {
  border: 1px solid var(--mk-border);
  color: var(--mk-text);
  cursor: pointer;
  background: none;
  border-radius: 8px;
  align-items: center;
  gap: .35rem;
  padding: .45rem 1rem;
  font-size: .82rem;
  font-weight: 600;
  transition: border-color .15s, background .15s;
  display: inline-flex;
}

.mktg-success-share-btn:hover {
  background: rgba(255, 255, 255, .07);
  border-color: rgba(255, 255, 255, .2);
}

.mktg-proof-strip {
  flex-wrap: wrap;
  justify-content: center;
  gap: .5rem 1.5rem;
  margin-top: 1.5rem;
  display: flex;
}

.mktg-proof-item {
  color: var(--mk-muted);
  align-items: center;
  gap: .3rem;
  font-size: .8rem;
  display: flex;
}

.mktg-proof-sep {
  background: var(--mk-border);
  border-radius: 50%;
  width: 3px;
  height: 3px;
}

.mktg-stats {
  border-top: 1px solid var(--mk-border);
  border-bottom: 1px solid var(--mk-border);
  background: #0b1320;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0;
  display: flex;
}

.mktg-stat {
  text-align: center;
  border-right: 1px solid var(--mk-border);
  padding: 2rem 3.5rem;
}

.mktg-stat:last-child {
  border-right: none;
}

.mktg-stat-val {
  color: #fff;
  font-size: 2.25rem;
  font-weight: 900;
  display: block;
}

.mktg-stat-label {
  color: var(--mk-muted);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-top: .2rem;
  font-size: .8rem;
}

.mktg-section {
  padding: var(--mk-section-py) 2rem;
}

.mktg-section-inner {
  max-width: 1200px;
  margin: 0 auto;
}

.mktg-section-eyebrow {
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--mk-accent);
  margin-bottom: .75rem;
  font-size: .78rem;
  font-weight: 700;
}

.mktg-section-h2 {
  letter-spacing: -.03em;
  color: #fff;
  margin-bottom: 1rem;
  font-size: clamp(1.8rem, 4vw, 2.75rem);
  font-weight: 900;
  line-height: 1.1;
}

.mktg-section-sub {
  color: var(--mk-muted);
  max-width: 640px;
  margin-bottom: 3rem;
  font-size: 1.05rem;
  line-height: 1.7;
}

.mktg-eyebrow-light {
  color: rgba(255, 255, 255, .5);
}

.mktg-h2-light {
  color: #fff;
}

.mktg-sub-light {
  color: rgba(255, 255, 255, .55);
}

.mktg-personas-scroll {
  scrollbar-width: thin;
  scrollbar-color: var(--mk-border) transparent;
  gap: 1.25rem;
  padding-bottom: 1rem;
  display: flex;
  overflow-x: auto;
}

.mktg-persona-card {
  background: var(--mk-surface);
  border: 1px solid var(--mk-border);
  border-radius: var(--mk-radius);
  border-top: 3px solid var(--mk-accent);
  flex-direction: column;
  flex-shrink: 0;
  width: 240px;
  padding: 1.5rem;
  transition: transform .2s, border-top-color .2s;
  display: flex;
}

.mktg-persona-card:hover {
  transform: translateY(-3px);
}

.mktg-accent--coral {
  border-top-color: #ff6b6b;
}

.mktg-accent--teal {
  border-top-color: #06d6a0;
}

.mktg-accent--gold {
  border-top-color: #ffd166;
}

.mktg-accent--green {
  border-top-color: #06d6a0;
}

.mktg-accent--orange {
  border-top-color: #ff9f43;
}

.mktg-accent--purple {
  border-top-color: #a78bfa;
}

.mktg-persona-icon {
  margin-bottom: .75rem;
  font-size: 1.75rem;
}

.mktg-persona-name {
  color: #fff;
  margin-bottom: .25rem;
  font-size: 1rem;
  font-weight: 700;
}

.mktg-persona-sub {
  color: var(--mk-muted);
  margin-bottom: 1rem;
  font-size: .78rem;
}

.mktg-persona-bullets {
  flex-direction: column;
  gap: .4rem;
  list-style: none;
  display: flex;
}

.mktg-persona-bullet {
  color: var(--mk-muted);
  align-items: flex-start;
  gap: .4rem;
  font-size: .8rem;
  line-height: 1.4;
  display: flex;
}

.mktg-persona-cta {
  color: #ffaa80;
  margin-top: auto;
  padding-top: 1rem;
  font-size: .82rem;
  font-weight: 700;
  text-decoration: none;
}

.mktg-persona-cta:hover {
  color: #fff;
}

.mktg-feature-grid {
  background: var(--mk-border);
  border: 1px solid var(--mk-border);
  border-radius: var(--mk-radius);
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  display: grid;
  overflow: hidden;
}

.mktg-feature-cell {
  background: var(--mk-surface);
  padding: 2rem;
  transition: background .15s;
}

.mktg-feature-cell:hover {
  background: var(--mk-surface2);
}

.mktg-feature-icon {
  color: var(--mk-accent);
  margin-bottom: .75rem;
  font-size: 1.5rem;
  display: block;
}

.mktg-feature-title {
  color: #fff;
  margin-bottom: .5rem;
  font-size: .95rem;
  font-weight: 700;
}

.mktg-feature-desc {
  color: var(--mk-muted);
  font-size: .83rem;
  line-height: 1.6;
}

.mktg-features {
  background: rgba(255, 255, 255, .016);
}

.mktg-str-section {
  background: #070d18;
}

.mktg-str-grid {
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  display: grid;
}

.mktg-str-card {
  border: 1px solid var(--mk-border);
  border-radius: var(--mk-radius);
  background: rgba(255, 255, 255, .04);
  padding: 2rem;
}

.mktg-str-icon {
  color: var(--mk-accent);
  margin-bottom: 1rem;
  font-size: 1.75rem;
  display: block;
}

.mktg-str-title {
  color: #fff;
  margin-bottom: .5rem;
  font-size: 1rem;
  font-weight: 700;
}

.mktg-str-desc {
  color: rgba(255, 255, 255, .5);
  font-size: .85rem;
  line-height: 1.65;
}

.mktg-market-grid {
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
  max-width: 700px;
  display: grid;
}

.mktg-market-card {
  background: var(--mk-surface);
  border: 1px solid var(--mk-border);
  border-radius: var(--mk-radius);
  border-left: 3px solid var(--mk-accent);
  align-items: flex-start;
  gap: 1rem;
  padding: 1.25rem;
  display: flex;
}

.mktg-market-flag {
  flex-shrink: 0;
  font-size: 1.75rem;
}

.mktg-market-name {
  color: #fff;
  margin-bottom: .25rem;
  font-size: .9rem;
  font-weight: 700;
}

.mktg-market-desc {
  color: var(--mk-muted);
  font-size: .78rem;
  line-height: 1.5;
}

.mktg-rail-grid {
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25rem;
  display: grid;
}

.mktg-rail-card {
  background: var(--mk-surface);
  border: 1px solid var(--mk-border);
  border-radius: var(--mk-radius);
  text-align: center;
  padding: 1.5rem;
}

.mktg-rail-icon {
  margin-bottom: .75rem;
  font-size: 2rem;
}

.mktg-rail-name {
  color: #fff;
  margin-bottom: .4rem;
  font-size: .9rem;
  font-weight: 700;
}

.mktg-rail-desc {
  color: var(--mk-muted);
  font-size: .78rem;
  line-height: 1.55;
}

.mktg-pricing-grid {
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25rem;
  max-width: 1280px;
  display: grid;
}

.mktg-pricing-card {
  background: var(--mk-surface);
  border: 1px solid var(--mk-border);
  border-radius: 16px;
  flex-direction: column;
  gap: .5rem;
  padding: 2rem;
  display: flex;
}

.mktg-pricing-featured {
  background: var(--mk-surface2);
  border-color: rgba(255, 107, 53, .35);
  box-shadow: 0 0 40px rgba(255, 107, 53, .1);
}

.mktg-pricing-tier {
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--mk-muted);
  font-size: .78rem;
  font-weight: 700;
}

.mktg-pricing-featured .mktg-pricing-tier {
  color: var(--mk-accent);
}

.mktg-pricing-price {
  color: #fff;
  margin: .25rem 0;
  font-size: 2.5rem;
  font-weight: 900;
  line-height: 1;
}

.mktg-pricing-per {
  color: var(--mk-muted);
  font-size: 1rem;
  font-weight: 400;
}

.mktg-pricing-sub {
  color: var(--mk-muted);
  margin-bottom: .75rem;
  font-size: .82rem;
}

.mktg-pricing-features {
  flex-direction: column;
  flex: 1;
  gap: .5rem;
  margin-bottom: 1.5rem;
  list-style: none;
  display: flex;
}

.mktg-pf {
  color: var(--mk-muted);
  align-items: center;
  gap: .5rem;
  font-size: .85rem;
  display: flex;
}

.mktg-pricing-btn {
  text-align: center;
  border-radius: 10px;
  padding: .75rem;
  font-size: .9rem;
  font-weight: 600;
  text-decoration: none;
  transition: all .15s;
  display: block;
}

.mktg-pricing-btn-accent {
  background: var(--mk-accent);
  color: #fff;
}

.mktg-pricing-btn-accent:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(255, 107, 53, .35);
}

.mktg-pricing-btn-ghost {
  border: 1px solid var(--mk-border);
  color: var(--mk-muted);
}

.mktg-pricing-btn-ghost:hover {
  color: var(--mk-text);
  border-color: rgba(255, 255, 255, .2);
}

.mktg-pricing-pm-callout {
  color: var(--mk-muted);
  background: rgba(6, 214, 160, .06);
  border: 1px solid rgba(6, 214, 160, .18);
  border-radius: 12px;
  align-items: flex-start;
  gap: 1rem;
  margin-top: 2.5rem;
  padding: 1.25rem 1.5rem;
  font-size: .9rem;
  line-height: 1.6;
  display: flex;
}

.mktg-pricing-pm-callout strong {
  color: var(--mk-text);
}

.mktg-pricing-pm-callout a {
  color: #06d6a0;
  text-decoration: none;
}

.mktg-pricing-pm-callout a:hover {
  text-decoration: underline;
}

.vp-tab-row {
  border-bottom: 1px solid var(--mk-border);
  flex-wrap: wrap;
  justify-content: center;
  gap: .5rem;
  margin-bottom: 2rem;
  padding-bottom: 0;
  display: flex;
}

.vp-tab {
  color: var(--mk-muted);
  cursor: pointer;
  background: none;
  border: none;
  border-bottom: 2px solid rgba(0, 0, 0, 0);
  border-radius: 8px 8px 0 0;
  align-items: center;
  gap: .4rem;
  margin-bottom: -1px;
  padding: .65rem 1.25rem;
  font-size: .875rem;
  font-weight: 500;
  transition: color .15s, border-color .15s, background .15s;
  display: flex;
}

.vp-tab:hover {
  color: var(--mk-text);
  background: rgba(255, 255, 255, .04);
}

.vp-tab--active {
  color: #fff;
  border-bottom-color: var(--mk-accent);
  background: rgba(255, 107, 53, .06);
}

.vp-panel {
  max-width: 760px;
  margin: 0 auto;
}

.vp-chrome {
  border: 1px solid var(--mk-border);
  background: rgba(255, 255, 255, .05);
  border-bottom: none;
  border-radius: 10px 10px 0 0;
  align-items: center;
  gap: .4rem;
  padding: .6rem 1rem;
  display: flex;
}

.vp-chrome-dot {
  border-radius: 50%;
  width: 11px;
  height: 11px;
  display: inline-block;
}

.vp-chrome-url {
  text-align: center;
  color: var(--mk-muted);
  margin-left: .75rem;
  background: rgba(255, 255, 255, .07);
  border-radius: 5px;
  flex: 1;
  max-width: 320px;
  margin-inline: auto;
  padding: .2rem .75rem;
  font-size: .75rem;
}

.vp-screen {
  border: 1px solid var(--mk-border);
  background: rgba(10, 18, 32, .9);
  border-radius: 0 0 10px 10px;
  min-height: 340px;
  padding: 1.5rem;
}

.vp-caption {
  text-align: center;
  color: var(--mk-muted);
  margin-top: .75rem;
  font-size: .8rem;
  font-style: italic;
}

.vp-avatar {
  background: linear-gradient(135deg, var(--mk-accent), #ff9a3c);
  color: #fff;
  border-radius: 12px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  font-size: .95rem;
  font-weight: 800;
  display: flex;
}

.vp-avatar-sm {
  border-radius: 9px;
  width: 36px;
  height: 36px;
  font-size: .8rem;
}

.vp-profile-header {
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1.25rem;
  display: flex;
}

.vp-profile-meta {
  flex: 1;
  min-width: 0;
}

.vp-profile-name {
  color: #fff;
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
}

.vp-profile-trade {
  color: var(--mk-muted);
  margin-top: .2rem;
  font-size: .8rem;
}

.vp-verified-badge {
  color: #06d6a0;
  background: rgba(6, 214, 160, .12);
  border: 1px solid rgba(6, 214, 160, .25);
  border-radius: 5px;
  align-items: center;
  gap: .2rem;
  padding: .1rem .4rem;
  font-size: .72rem;
  font-weight: 600;
  display: inline-flex;
}

.vp-stat-chip {
  color: var(--mk-muted);
  background: rgba(255, 255, 255, .06);
  border-radius: 5px;
  align-items: center;
  gap: .25rem;
  padding: .2rem .5rem;
  font-size: .75rem;
  display: inline-flex;
}

.vp-score-badge {
  text-align: center;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 12px;
  flex-shrink: 0;
  padding: .75rem 1.1rem;
}

.vp-score-num {
  color: #fff;
  background: linear-gradient(135deg, #06d6a0, #00b894);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  font-size: 2rem;
  font-weight: 900;
  line-height: 1;
}

.vp-score-label {
  color: var(--mk-muted);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-top: .1rem;
  font-size: .65rem;
}

.vp-score-band {
  border-radius: 4px;
  margin-top: .3rem;
  padding: .15rem .45rem;
  font-size: .7rem;
  font-weight: 700;
  display: inline-block;
}

.vp-band-elite {
  color: #06d6a0;
  background: rgba(6, 214, 160, .2);
  border: 1px solid rgba(6, 214, 160, .3);
}

.vp-band-pro {
  color: #ff6b35;
  background: rgba(255, 107, 53, .2);
  border: 1px solid rgba(255, 107, 53, .3);
}

.vp-band-rising {
  color: #f59e0b;
  background: rgba(245, 158, 11, .2);
  border: 1px solid rgba(245, 158, 11, .3);
}

.vp-scorecard-section {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 10px;
  padding: 1rem;
}

.vp-sc-header {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  margin-bottom: .9rem;
  display: flex;
}

.vp-confidence-chip {
  color: #06d6a0;
  background: rgba(6, 214, 160, .1);
  border: 1px solid rgba(6, 214, 160, .2);
  border-radius: 4px;
  padding: .15rem .5rem;
  font-size: .7rem;
}

.vp-dimensions {
  flex-direction: column;
  gap: .65rem;
  display: flex;
}

.vp-dim {
  grid-template-columns: 1fr 3fr auto;
  align-items: center;
  gap: .5rem;
  display: grid;
}

.vp-dim-label {
  color: var(--mk-text);
  justify-content: space-between;
  font-size: .78rem;
  display: flex;
}

.vp-dim-score {
  color: #fff;
  font-size: .78rem;
  font-weight: 700;
}

.vp-dim-bar-track {
  background: rgba(255, 255, 255, .1);
  border-radius: 3px;
  height: 6px;
  overflow: hidden;
}

.vp-dim-bar {
  border-radius: 3px;
  height: 100%;
  transition: width .4s;
}

.vp-dim-pct {
  color: var(--mk-muted);
  text-align: right;
  white-space: nowrap;
  font-size: .68rem;
}

.vp-trend-row {
  border-top: 1px solid rgba(255, 255, 255, .07);
  justify-content: space-between;
  align-items: center;
  margin-top: 1rem;
  padding-top: .75rem;
  display: flex;
}

.vp-sparkline {
  align-items: center;
  gap: .5rem;
  display: flex;
}

.vp-profile-footer {
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 10px;
  gap: 0;
  margin-top: 1.25rem;
  display: flex;
  overflow: hidden;
}

.vp-foot-stat {
  border-right: 1px solid rgba(255, 255, 255, .08);
  flex-direction: column;
  flex: 1;
  align-items: center;
  padding: .75rem .5rem;
  display: flex;
}

.vp-foot-stat:last-child {
  border-right: none;
}

.vp-foot-num {
  color: #fff;
  font-size: 1rem;
  font-weight: 800;
}

.vp-foot-label {
  color: var(--mk-muted);
  text-align: center;
  margin-top: .1rem;
  font-size: .65rem;
}

.vp-search-bar {
  background: rgba(255, 255, 255, .07);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 8px;
  align-items: center;
  gap: .75rem;
  padding: .6rem 1rem;
  display: flex;
}

.vp-search-badge {
  color: #06d6a0;
  background: rgba(6, 214, 160, .12);
  border: 1px solid rgba(6, 214, 160, .2);
  border-radius: 4px;
  margin-left: auto;
  padding: .15rem .5rem;
  font-size: .72rem;
}

.vp-search-card {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 10px;
  align-items: flex-start;
  gap: .75rem;
  padding: .9rem 1rem;
  transition: border-color .15s;
  display: flex;
}

.vp-search-card--top {
  background: rgba(255, 107, 53, .05);
  border-color: rgba(255, 107, 53, .25);
  box-shadow: 0 0 20px rgba(255, 107, 53, .07);
}

.vp-sc-rank {
  color: var(--mk-accent);
  min-width: 1.5rem;
  padding-top: .15rem;
  font-size: .75rem;
  font-weight: 800;
}

.vp-search-atlas-score {
  color: #fff;
  background: rgba(6, 214, 160, .15);
  border: 1px solid rgba(6, 214, 160, .25);
  border-radius: 4px;
  padding: .1rem .4rem;
  font-size: .72rem;
  font-weight: 700;
}

.vp-tag {
  color: var(--mk-muted);
  white-space: nowrap;
  background: rgba(255, 255, 255, .07);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 4px;
  padding: .15rem .45rem;
  font-size: .7rem;
}

.vp-tag-green {
  color: #06d6a0;
  background: rgba(6, 214, 160, .1);
  border-color: rgba(6, 214, 160, .2);
}

.vp-service-card {
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 12px;
  padding: 1.25rem;
}

.vp-recent-jobs {
  border-top: 1px solid rgba(255, 255, 255, .07);
  margin-top: 1rem;
  padding-top: .9rem;
}

.vp-job-row {
  color: var(--mk-muted);
  align-items: center;
  gap: .5rem;
  margin-bottom: .4rem;
  font-size: .8rem;
  display: flex;
}

.vp-job-rating {
  color: #f59e0b;
  margin-left: auto;
  font-size: .78rem;
  font-weight: 700;
}

.vnd-how-grid {
  margin-top: 2.5rem;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  max-width: 900px;
  margin-inline: auto;
  display: grid;
}

.vnd-how-step {
  background: var(--mk-surface);
  border: 1px solid var(--mk-border);
  text-align: center;
  border-radius: 14px;
  padding: 2rem 1.5rem;
  position: relative;
}

.vnd-how-icon {
  border: 2px solid;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 52px;
  height: 52px;
  margin: 0 auto 1rem;
  display: flex;
}

.vnd-how-num {
  color: var(--mk-muted);
  background: var(--mk-surface2);
  border: 1px solid var(--mk-border);
  border-radius: 20px;
  padding: .1rem .45rem;
  font-size: .62rem;
  font-weight: 900;
  position: absolute;
  top: 1rem;
  right: 1rem;
}

.vnd-how-title {
  margin-bottom: .5rem;
  font-size: .95rem;
  font-weight: 700;
}

.vnd-how-desc {
  color: var(--mk-muted);
  font-size: .83rem;
  line-height: 1.65;
}

.vnd-trades-grid {
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: .85rem;
  margin-top: 2.5rem;
  display: grid;
}

.vnd-trade-card {
  background: var(--mk-surface);
  border: 1px solid var(--mk-border);
  cursor: pointer;
  color: var(--mk-text);
  border-radius: 11px;
  align-items: flex-start;
  gap: .85rem;
  padding: 1rem 1.1rem;
  text-decoration: none;
  transition: border-color .15s, transform .15s;
  display: flex;
}

.vnd-trade-card:hover {
  border-color: rgba(6, 214, 160, .35);
  transform: translateY(-2px);
}

.vnd-trade-icon {
  flex-shrink: 0;
  margin-top: .1rem;
  font-size: 1.4rem;
  line-height: 1;
}

.vnd-trade-name {
  color: var(--mk-text);
  margin-bottom: .2rem;
  font-size: .88rem;
  font-weight: 700;
}

.vnd-trade-desc {
  color: var(--mk-muted);
  font-size: .75rem;
  line-height: 1.5;
}

@media (width <= 768px) {
  .vnd-how-grid {
    grid-template-columns: 1fr;
  }

  #pm-owner-portal .mktg-section-inner {
    grid-template-columns: 1fr !important;
  }
}

.mktg-cta-section {
  background: #070d18;
  padding: 6rem 2rem;
}

.mktg-cta-inner {
  text-align: center;
}

.mktg-cta-h2 {
  color: #fff;
  margin-bottom: .75rem;
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 900;
}

.mktg-cta-sub {
  color: rgba(255, 255, 255, .5);
  margin-bottom: 2rem;
  font-size: 1.05rem;
}

.mktg-footer {
  border-top: 1px solid var(--mk-border);
  background: #050b14;
  padding: 2.5rem 2rem;
}

.mktg-footer-inner {
  flex-direction: column;
  gap: 1.75rem;
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
}

.mktg-footer-brand {
  flex-direction: column;
  gap: .25rem;
  display: flex;
}

.mktg-footer-logo {
  color: #fff;
  font-size: 1.1rem;
  font-weight: 800;
}

.mktg-footer-tagline {
  color: var(--mk-muted);
  font-size: .78rem;
}

.mktg-footer-dirs {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.5rem 2rem;
  display: grid;
}

.mktg-footer-col-title {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .45);
  margin-bottom: .65rem;
  font-size: .7rem;
  font-weight: 700;
}

.mktg-footer-col-links {
  flex-direction: column;
  gap: .55rem;
  display: flex;
}

.mktg-footer-col-links a, .mktg-footer-links a {
  color: var(--mk-muted);
  min-height: 1.5rem;
  padding: .15rem 0;
  font-size: .9rem;
  text-decoration: none;
  transition: color .15s;
}

.mktg-footer-col-links a:hover, .mktg-footer-links a:hover {
  color: var(--mk-text);
}

.mktg-footer-links {
  flex-wrap: wrap;
  gap: 1.5rem;
  display: flex;
}

.mktg-footer-legal {
  color: var(--mk-muted);
  font-size: .78rem;
}

.mktg-footer-legal a {
  color: var(--mk-muted);
  transition: color .15s;
}

.mktg-footer-legal a:hover {
  color: var(--mk-text);
}

@media (width <= 720px) {
  .mktg-footer-dirs {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }

  .mktg-footer-col-links a {
    padding: .35rem 0;
    font-size: .95rem;
  }
}

.refer-form {
  flex-direction: column;
  gap: .35rem;
  display: flex;
}

.refer-label {
  color: var(--mk-muted);
  margin-top: .85rem;
  margin-bottom: .35rem;
  font-size: .75rem;
  font-weight: 600;
  display: block;
}

.refer-form .mktg-wl-input, .refer-form .mktg-wl-select {
  width: 100%;
}

.mktg-skeleton-page {
  min-height: 100vh;
}

.mktg-hero--skeleton {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1rem;
}

.mktg-skeleton {
  background: rgba(255, 255, 255, .06);
  border-radius: 8px;
  animation: 1.5s ease-in-out infinite mktg-pulse;
}

.mktg-sk-h1 {
  width: 480px;
  max-width: 90vw;
  height: 56px;
}

.mktg-sk-sub {
  width: 340px;
  max-width: 80vw;
  height: 20px;
}

.mktg-sk-btn {
  border-radius: 10px;
  width: 200px;
  height: 46px;
}

@keyframes mktg-pulse {
  0%, 100% {
    opacity: .5;
  }

  50% {
    opacity: 1;
  }
}

@media (width <= 1100px) {
  .mktg-nav-inner {
    gap: .9rem;
    padding: .65rem 1.25rem;
  }

  .mktg-nav-links {
    gap: .7rem;
  }

  .mktg-pricing-grid {
    grid-template-columns: repeat(2, 1fr);
    max-width: 760px;
  }
}

@media (width <= 900px) {
  .mktg-nav-links {
    display: none;
  }

  .mktg-feature-grid {
    grid-template-columns: 1fr 1fr;
  }

  .mktg-str-grid, .mktg-pricing-grid, .mktg-rail-grid, .mktg-market-grid {
    grid-template-columns: 1fr;
  }

  .mktg-stats {
    flex-direction: column;
  }

  .mktg-stat {
    border-right: none;
    border-bottom: 1px solid var(--mk-border);
  }
}

@media (width <= 600px) {
  .mktg-hero {
    padding: 6rem 1.25rem 4rem;
  }

  .mktg-feature-grid {
    grid-template-columns: 1fr;
  }

  .mktg-wl-row {
    flex-direction: column;
  }

  .mktg-section {
    padding: 4rem 1.25rem;
  }

  .mktg-success-card {
    text-align: center;
    flex-direction: column;
  }

  .mktg-success-div {
    display: none;
  }

  .mktg-hero-h1 {
    font-size: clamp(2rem, 9vw, 3.5rem);
  }

  .mktg-pricing-card {
    padding: 1.5rem 1.25rem;
  }
}

.mktg-nav-hamburger {
  cursor: pointer;
  color: var(--mk-text);
  background: none;
  border: none;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  margin-left: .5rem;
  padding: .35rem;
  transition: background .15s;
  display: none;
}

.mktg-nav-hamburger:hover {
  background: rgba(255, 255, 255, .07);
}

.mktg-nav-hamburger .material-symbols-outlined {
  font-size: 1.5rem;
}

@media (width <= 900px) {
  .mktg-nav-hamburger {
    display: flex;
  }
}

.mktg-mobile-nav {
  pointer-events: none;
  -webkit-backdrop-filter: blur(8px);
  z-index: 98;
  border-top: 1px solid var(--mk-border);
  background: rgba(7, 13, 24, .97);
  flex-direction: column;
  gap: 0;
  padding: 2rem 1.5rem 3rem;
  display: none;
  position: fixed;
  inset: 64px 0 0;
  overflow-y: auto;
}

.mktg-mobile-nav--open {
  pointer-events: auto;
  display: flex;
}

.mktg-mobile-nav a {
  color: var(--mk-text);
  border-bottom: 1px solid rgba(255, 255, 255, .06);
  padding: 1rem 0;
  font-size: 1.1rem;
  font-weight: 500;
  text-decoration: none;
  transition: color .15s;
  display: block;
}

.mktg-mobile-nav a:hover {
  color: var(--mk-accent);
}

.mktg-mobile-nav-broker {
  color: var(--mk-muted) !important;
  font-size: .95rem !important;
}

.mktg-mobile-nav-cta {
  text-align: center !important;
  border-bottom: none !important;
  border-radius: 8px !important;
  margin-top: 1.5rem !important;
  padding: .85rem 1.5rem !important;
  font-size: 1rem !important;
}

@media (width <= 900px) {
  .mktg-nav-hamburger {
    display: flex;
  }

  .mktg-btn-signin span + * {
    display: none;
  }
}

.login-page, .login-card {
  all: unset;
}

.login-layout {
  --login-bg: #090f1a;
  --login-surface: #0f1825;
  --login-surface-2: #141e2e;
  --login-border: rgba(255, 255, 255, .09);
  --login-border-hi: rgba(255, 255, 255, .16);
  --login-text: #e8edf5;
  --login-muted: #8a97b0;
  --login-faint: rgba(232, 237, 245, .38);
  --login-accent: #ff6b35;
  --login-accent-h: #ff824f;
  --login-accent-dim: rgba(255, 107, 53, .12);
  --login-green: #06d6a0;
  --login-green-dim: rgba(6, 214, 160, .12);
  --login-green-b: rgba(6, 214, 160, .28);
  --login-error: #f87171;
  --login-card: rgba(255, 255, 255, .04);
  background: var(--login-bg);
  min-height: 100vh;
  color: var(--login-text);
  grid-template-columns: 1fr 1fr;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
  display: grid;
}

.login-brand {
  border-right: 1px solid var(--login-border);
  background: linear-gradient(160deg, #0a1628 0%, #071020 100%);
  flex-direction: column;
  display: flex;
  position: relative;
  overflow: hidden;
}

.login-brand-grid {
  pointer-events: none;
  background-image: linear-gradient(rgba(255, 255, 255, .024) 1px, rgba(0, 0, 0, 0) 1px), linear-gradient(90deg, rgba(255, 255, 255, .024) 1px, rgba(0, 0, 0, 0) 1px);
  background-size: 48px 48px;
  position: absolute;
  inset: 0;
  -webkit-mask-image: radial-gradient(85% 80% at 35% 45%, #000 35%, rgba(0, 0, 0, 0) 100%);
  mask-image: radial-gradient(85% 80% at 35% 45%, #000 35%, rgba(0, 0, 0, 0) 100%);
}

.login-brand-glow {
  pointer-events: none;
  background: radial-gradient(circle, rgba(6, 214, 160, .16) 0%, rgba(0, 0, 0, 0) 68%);
  border-radius: 50%;
  width: 520px;
  height: 520px;
  position: absolute;
  bottom: -140px;
  right: -160px;
}

.login-brand-inner {
  z-index: 1;
  color: #e8edf5;
  flex-direction: column;
  height: 100%;
  padding: 2.75rem 2.5rem 2.5rem;
  display: flex;
  position: relative;
}

.login-brand-logo {
  color: inherit;
  align-items: center;
  gap: .6rem;
  margin-bottom: .5rem;
  text-decoration: none;
  display: inline-flex;
}

.login-logo-mark {
  color: #fff;
  background: linear-gradient(135deg, #ff6b35, #ff9a3c);
  border-radius: 9px;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  font-size: 1.05rem;
  font-weight: 900;
  display: flex;
}

.login-logo-text {
  color: #fff;
  letter-spacing: -.03em;
  font-size: 1.2rem;
  font-weight: 800;
}

.login-brand-tagline {
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .35);
  margin-bottom: auto;
  font-size: .68rem;
  font-weight: 600;
}

.login-brand-hero-copy {
  margin: 2.5rem 0 0;
}

.login-brand-headline {
  color: #fff;
  letter-spacing: -.03em;
  margin: 0 0 .85rem;
  font-size: clamp(1.65rem, 2.8vw, 2.25rem);
  font-weight: 900;
  line-height: 1.12;
}

.login-brand-headline em {
  background: linear-gradient(90deg, #06d6a0, #3b9eff);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  font-style: normal;
}

.login-brand-subline {
  color: rgba(255, 255, 255, .5);
  max-width: 360px;
  margin: 0;
  font-size: .875rem;
  line-height: 1.65;
}

.login-brand-stats {
  gap: 1.75rem;
  margin: 2rem 0 1.75rem;
  display: flex;
}

.login-stat {
  flex-direction: column;
  display: flex;
}

.login-stat-val {
  color: #fff;
  letter-spacing: -.03em;
  font-size: 1.45rem;
  font-weight: 900;
  line-height: 1;
}

.login-stat-label {
  text-transform: uppercase;
  letter-spacing: .06em;
  color: rgba(255, 255, 255, .38);
  max-width: 110px;
  margin-top: .3rem;
  font-size: .65rem;
  font-weight: 600;
  line-height: 1.35;
}

.login-brand-roles {
  flex-wrap: wrap;
  gap: .45rem;
  margin-bottom: 2rem;
  display: flex;
}

.login-role-tag {
  color: rgba(255, 255, 255, .52);
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 999px;
  padding: .28rem .7rem;
  font-size: .7rem;
  font-weight: 600;
}

.login-brand-footer {
  border-top: 1px solid rgba(255, 255, 255, .07);
  margin-top: auto;
  padding-top: 1.5rem;
}

.login-testimonial-quote {
  color: rgba(255, 255, 255, .62);
  margin-bottom: .65rem;
  font-size: .875rem;
  font-style: italic;
  line-height: 1.6;
}

.login-testimonial-name {
  color: #fff;
  font-size: .8rem;
  font-weight: 700;
  display: block;
}

.login-testimonial-meta {
  color: rgba(255, 255, 255, .38);
  font-size: .7rem;
}

.login-auth-panel {
  padding: 2.5rem 1.75rem calc(2.5rem + env(safe-area-inset-bottom, 0px));
  background: var(--login-bg);
  -webkit-overflow-scrolling: touch;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  min-height: 100dvh;
  display: flex;
  overflow-y: auto;
}

.login-auth-inner {
  flex-shrink: 0;
  width: 100%;
  max-width: 400px;
  margin-block: auto;
}

.login-mobile-logo {
  align-items: center;
  gap: .5rem;
  margin-bottom: 2rem;
  display: none;
}

.login-mobile-logo .login-logo-text {
  color: var(--login-text);
}

.login-screen {
  flex-direction: column;
  animation: .28s ease-out both login-fade-up;
  display: flex;
}

.login-screen:not(.login-screen--active) {
  display: none;
}

.login-screen--active {
  display: flex;
}

.login-screen--center {
  text-align: center;
  align-items: center;
}

@keyframes login-fade-up {
  from {
    opacity: 0;
    transform: translateY(6px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.login-auth-h1 {
  letter-spacing: -.035em;
  color: var(--login-text);
  margin-bottom: .4rem;
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1.15;
}

.login-auth-sub {
  color: var(--login-muted);
  margin-bottom: 1.5rem;
  font-size: .875rem;
  line-height: 1.6;
}

.login-auth-sub strong {
  color: var(--login-text);
  font-weight: 600;
}

.login-back-btn {
  color: var(--login-muted);
  cursor: pointer;
  background: none;
  border: none;
  align-items: center;
  gap: .35rem;
  margin-bottom: 1.15rem;
  padding: 0;
  font-family: inherit;
  font-size: .75rem;
  font-weight: 600;
  transition: color .15s ease-out, transform .1s ease-out;
  display: inline-flex;
}

.login-back-btn:hover {
  color: var(--login-text);
}

.login-back-btn:active {
  transform: scale(.98);
}

.login-auth-form {
  flex-direction: column;
  gap: .875rem;
  display: flex;
}

.login-field {
  flex-direction: column;
  gap: .4rem;
  display: flex;
}

.login-field-label {
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--login-muted);
  font-size: .72rem;
  font-weight: 700;
}

.login-field-input {
  border: 1.5px solid var(--login-border);
  width: 100%;
  color: var(--login-text);
  font: inherit;
  background: rgba(255, 255, 255, .05);
  border-radius: 10px;
  outline: none;
  padding: .8rem 1rem;
  font-size: .925rem;
  transition: border-color .15s ease-out, background .15s ease-out, box-shadow .15s ease-out;
}

.login-field-input::placeholder {
  color: var(--login-faint);
}

.login-field-input:focus {
  border-color: var(--login-accent);
  box-shadow: 0 0 0 3px var(--login-accent-dim);
  background: rgba(255, 255, 255, .08);
}

.login-field-error {
  color: var(--login-error);
  font-size: .8rem;
  display: none;
}

.login-field-error--show {
  display: block;
}

.login-auth-btn {
  background: var(--login-accent);
  color: #fff;
  width: 100%;
  font: inherit;
  cursor: pointer;
  border: none;
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  gap: .5rem;
  padding: .8rem 1.25rem;
  font-size: .925rem;
  font-weight: 700;
  transition: transform .1s ease-out, box-shadow .18s ease-out, background .15s ease-out, opacity .15s;
  display: inline-flex;
  box-shadow: inset 0 1px rgba(255, 255, 255, .12);
}

.login-auth-btn:hover:not(:disabled) {
  background: var(--login-accent-h);
  box-shadow: 0 8px 24px rgba(255, 107, 53, .28);
}

.login-auth-btn:active:not(:disabled) {
  transform: scale(.97);
}

.login-auth-btn:disabled {
  opacity: .55;
  cursor: default;
  transform: none;
}

.login-auth-btn--green {
  background: var(--login-green);
  color: #04140f;
  box-shadow: none;
  margin-bottom: .75rem;
}

.login-auth-btn--green:hover:not(:disabled) {
  opacity: .9;
  box-shadow: none;
  background: var(--login-green);
}

.login-auth-actions {
  background: none;
  flex-direction: column;
  flex-shrink: 0;
  width: 100%;
  margin-top: 1rem;
  padding-top: 0;
  display: flex;
  position: static;
}

.login-btn-text {
  width: 100%;
  color: var(--login-muted);
  text-align: center;
  cursor: pointer;
  background: none;
  border: none;
  padding: .55rem;
  font-family: inherit;
  font-size: .825rem;
  font-weight: 600;
  transition: color .15s ease-out, transform .1s ease-out;
}

.login-btn-text:hover {
  color: var(--login-text);
}

.login-btn-text:active {
  transform: scale(.98);
}

.login-btn-spinner {
  border: 2px solid rgba(255, 255, 255, .3);
  border-top-color: #fff;
  border-radius: 50%;
  width: 16px;
  height: 16px;
  animation: .7s linear infinite mktg-spin;
}

@keyframes mktg-spin {
  to {
    transform: rotate(360deg);
  }
}

.login-divider {
  color: var(--login-muted);
  align-items: center;
  gap: .85rem;
  margin: 1.25rem 0;
  font-size: .75rem;
  font-weight: 500;
  display: flex;
}

.login-divider:before, .login-divider:after {
  content: "";
  background: var(--login-border);
  flex: 1;
  height: 1px;
}

.login-passkey-btn {
  background: var(--login-card);
  cursor: pointer;
  text-align: left;
  width: 100%;
  color: inherit;
  border: 1.5px solid rgba(255, 255, 255, .1);
  border-radius: 10px;
  align-items: center;
  gap: .875rem;
  padding: .875rem 1rem;
  font-family: inherit;
  transition: border-color .18s ease-out, background .18s ease-out, transform .1s ease-out;
  display: flex;
}

.login-passkey-btn:hover:not(:disabled) {
  background: rgba(6, 214, 160, .08);
  border-color: rgba(6, 214, 160, .4);
}

.login-passkey-btn:active:not(:disabled) {
  transform: scale(.985);
}

.login-passkey-btn:disabled {
  opacity: .7;
  cursor: default;
}

.login-passkey-btn:focus-visible {
  box-shadow: 0 0 0 3px var(--login-green-dim);
  border-color: rgba(6, 214, 160, .4);
  outline: none;
}

.login-passkey-icon-box {
  background: var(--login-green-dim);
  border: 1px solid var(--login-green-b);
  width: 40px;
  height: 40px;
  color: var(--login-green);
  border-radius: 9px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: flex;
}

.login-passkey-icon-box .material-symbols-outlined {
  color: var(--login-green);
  font-size: 22px;
}

.login-icon-fill {
  font-variation-settings: "FILL" 1;
}

.login-passkey-btn-text {
  flex-direction: column;
  flex: 1;
  gap: .15rem;
  min-width: 0;
  display: flex;
}

.login-passkey-btn-label {
  color: var(--login-text);
  font-size: .85rem;
  font-weight: 600;
  line-height: 1.2;
}

.login-passkey-btn-sub {
  color: var(--login-muted);
  font-size: .7rem;
  line-height: 1.3;
}

.login-passkey-chevron {
  color: var(--login-faint);
  flex-shrink: 0;
  font-size: 18px !important;
}

.login-passkey-prompt {
  text-align: center;
  flex-direction: column;
  align-items: center;
  display: flex;
}

.login-passkey-ring-wrap {
  margin-bottom: 1.25rem;
  display: inline-block;
  position: relative;
}

.login-passkey-ring {
  border: 2px solid var(--login-green-b);
  background: var(--login-green-dim);
  width: 88px;
  height: 88px;
  color: var(--login-green);
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  animation: 1.8s ease-in-out infinite login-passkey-pulse;
  display: flex;
}

.login-passkey-ring .material-symbols-outlined {
  color: var(--login-green);
}

.login-passkey-ring-badge {
  border: 2px solid var(--login-bg);
  color: #fff;
  background: #0a1628;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  display: flex;
  position: absolute;
  bottom: -4px;
  right: -4px;
}

.login-passkey-ring-badge .material-symbols-outlined {
  color: #fff;
}

@keyframes login-passkey-pulse {
  0%, 100% {
    box-shadow: 0 0 rgba(6, 214, 160, .4);
  }

  50% {
    box-shadow: 0 0 0 14px rgba(0, 0, 0, 0);
  }
}

.login-dots {
  justify-content: center;
  gap: 5px;
  margin-bottom: 1.25rem;
  display: flex;
}

.login-dots--hidden {
  display: none;
}

.login-dot {
  background: var(--login-green);
  border-radius: 999px;
  width: 7px;
  height: 7px;
}

.login-dot--1 {
  animation: 1.2s ease-in-out infinite login-dot-bounce;
}

.login-dot--2 {
  animation: 1.2s ease-in-out .2s infinite login-dot-bounce;
}

.login-dot--3 {
  animation: 1.2s ease-in-out .4s infinite login-dot-bounce;
}

@keyframes login-dot-bounce {
  0%, 80%, 100% {
    transform: translateY(0);
  }

  40% {
    transform: translateY(-5px);
  }
}

.login-email-preview {
  background: var(--login-card);
  border: 1px solid var(--login-border);
  border-radius: 10px;
  margin-bottom: 1.15rem;
  padding: 1rem;
}

.login-email-preview-hdr {
  align-items: center;
  gap: .625rem;
  margin-bottom: .875rem;
  display: flex;
}

.login-email-icon {
  color: #fff;
  background: linear-gradient(135deg, #ff6b35, #ff9a3c);
  border-radius: .375rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  font-size: .7rem;
  font-weight: 900;
  display: flex;
}

.login-email-subj {
  color: var(--login-text);
  font-size: .75rem;
  font-weight: 700;
}

.login-email-from {
  color: var(--login-muted);
  font-size: .6rem;
}

.login-email-body {
  background: var(--login-surface-2);
  border-radius: .5rem;
  padding: .875rem;
}

.login-email-body p {
  color: var(--login-muted);
  margin-bottom: .75rem;
  font-size: .75rem;
  line-height: 1.6;
}

.login-email-cta {
  color: #fff;
  background: #0a1628;
  border-radius: .4rem;
  align-items: center;
  gap: .35rem;
  padding: .5rem .875rem;
  font-size: .7rem;
  font-weight: 700;
  display: inline-flex;
}

.login-status-circle {
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 80px;
  margin-bottom: 1.1rem;
  display: flex;
}

.login-status-circle--green {
  background: var(--login-green-dim);
  border: 1px solid var(--login-green-b);
  color: var(--login-green);
}

.login-status-circle--green .material-symbols-outlined {
  color: var(--login-green);
}

.login-sent-email {
  color: var(--login-text);
  margin-bottom: 1.35rem;
  font-size: .875rem;
  font-weight: 700;
}

.login-cd-wrap {
  width: 100%;
  margin-bottom: 1.35rem;
}

.login-cd-hdr {
  color: var(--login-muted);
  justify-content: space-between;
  margin-bottom: .5rem;
  font-size: .65rem;
  display: flex;
}

.login-cd-time {
  font-variant-numeric: tabular-nums;
  color: var(--login-text);
  font-weight: 700;
}

.login-cd-track {
  background: var(--login-card);
  border: 1px solid var(--login-border);
  border-radius: 999px;
  height: 4px;
  overflow: hidden;
}

.login-cd-fill {
  background: var(--login-green);
  border-radius: 999px;
  height: 100%;
  transition: width 1s linear;
}

.login-stack-gap {
  flex-direction: column;
  gap: .625rem;
  width: 100%;
  display: flex;
}

.login-alt-actions {
  margin-top: 1.5rem;
}

.login-alt-text {
  color: var(--login-muted);
  text-align: center;
  font-size: .85rem;
}

.login-alt-link {
  color: var(--login-accent);
  font-weight: 600;
  text-decoration: none;
}

.login-alt-link:hover {
  color: var(--login-accent-h);
  text-underline-offset: 2px;
  text-decoration: underline;
}

.login-resend-btn {
  border: 1.5px solid var(--login-border);
  width: 100%;
  color: var(--login-muted);
  cursor: pointer;
  background: none;
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  gap: .35rem;
  padding: .7rem 1.25rem;
  font-family: inherit;
  font-size: .85rem;
  font-weight: 600;
  transition: border-color .15s, color .15s, transform .1s ease-out;
  display: inline-flex;
}

.login-resend-btn:hover:not(:disabled) {
  border-color: var(--login-border-hi);
  color: var(--login-text);
}

.login-resend-btn:active:not(:disabled) {
  transform: scale(.97);
}

.login-resend-btn:disabled {
  opacity: .55;
  cursor: default;
}

.login-legal {
  color: var(--login-muted);
  text-align: center;
  margin-top: 1.5rem;
  font-size: .7rem;
  line-height: 1.55;
}

.login-legal a {
  color: var(--login-muted);
  text-underline-offset: 2px;
  text-decoration: underline;
  transition: color .15s;
}

.login-legal a:hover {
  color: var(--login-text);
}

@media (prefers-reduced-motion: reduce) {
  .login-screen, .login-passkey-ring, .login-dot, .login-btn-spinner {
    animation: none !important;
  }

  .login-auth-btn, .login-passkey-btn, .login-back-btn, .login-btn-text, .login-resend-btn {
    transition: none !important;
  }
}

@media (width >= 1200px) {
  .login-brand-inner {
    padding: 3.25rem 3rem 2.75rem;
  }

  .login-auth-inner {
    max-width: 420px;
  }
}

@media (width <= 768px) {
  .login-layout {
    grid-template-columns: 1fr;
  }

  .login-brand {
    display: none;
  }

  .login-auth-panel {
    padding: 1.5rem 1.25rem calc(1.75rem + env(safe-area-inset-bottom, 0px));
    align-items: stretch;
  }

  .login-auth-inner {
    margin-block: 0;
  }

  .login-mobile-logo {
    display: flex;
  }
}

html:has(.login-layout--solo) {
  height: auto;
  min-height: 100dvh;
  overflow: hidden auto;
}

html:has(.login-layout--solo) body {
  height: auto;
  min-height: 100dvh;
  overflow: hidden auto;
}

.login-layout--solo {
  grid-template-columns: unset;
  align-content: unset;
  height: auto;
  min-height: 100dvh;
  max-height: none;
  display: block;
  overflow: visible;
}

.login-layout--solo .login-auth-panel {
  justify-content: unset;
  align-items: unset;
  height: auto;
  min-height: 100dvh;
  max-height: none;
  padding: 1.5rem 1.25rem calc(2rem + env(safe-area-inset-bottom, 0px));
  display: block;
  overflow: visible;
}

.login-layout--solo .login-auth-inner {
  width: 100%;
  max-width: 400px;
  margin-block: 0;
  margin-inline: auto;
}

.login-layout--solo .login-auth-btn, .login-layout--solo .login-btn-text {
  flex-shrink: 0;
  position: static;
}

@media (width <= 480px) {
  .login-device-preview {
    margin-bottom: 1rem;
    padding: .75rem;
  }

  .login-dp-modal {
    padding: .85rem .75rem;
  }

  .login-feature-list {
    gap: .65rem;
    margin-bottom: 1rem;
  }
}

@media (height <= 720px) {
  .login-layout--solo .login-device-preview {
    display: none;
  }
}

.login-feature-list {
  flex-direction: column;
  gap: .875rem;
  margin-bottom: 1.35rem;
  display: flex;
}

.login-feature-row {
  text-align: left;
  align-items: flex-start;
  gap: .875rem;
  display: flex;
}

.login-feature-icon {
  background: var(--login-green-dim);
  border: 1px solid var(--login-green-b);
  width: 36px;
  height: 36px;
  color: var(--login-green);
  border-radius: 9px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: flex;
}

.login-feature-icon .material-symbols-outlined {
  color: var(--login-green);
}

.login-feature-title {
  color: var(--login-text);
  margin-bottom: .125rem;
  font-size: .8rem;
  font-weight: 700;
}

.login-feature-sub {
  color: var(--login-muted);
  font-size: .7rem;
  line-height: 1.55;
}

.login-device-preview {
  background: var(--login-card);
  border: 1px solid var(--login-border);
  border-radius: 10px;
  margin-bottom: 1.15rem;
  padding: 1rem;
}

.login-dp-label {
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--login-muted);
  text-align: left;
  margin-bottom: .75rem;
  font-size: .6rem;
  font-weight: 700;
}

.login-dp-modal {
  background: var(--login-surface-2);
  border: 1px solid var(--login-border);
  text-align: center;
  border-radius: .65rem;
  flex-direction: column;
  align-items: center;
  padding: 1.25rem;
  display: flex;
}

.login-dp-modal-icon {
  color: #fff;
  background: linear-gradient(135deg, #ff6b35, #ff9a3c);
  border-radius: .75rem;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  margin-bottom: .875rem;
  font-size: 1.1rem;
  font-weight: 900;
  display: flex;
}

.login-dp-modal-title {
  color: var(--login-text);
  margin-bottom: .25rem;
  font-size: .8rem;
  font-weight: 700;
}

.login-dp-modal-domain {
  color: var(--login-muted);
  font-size: .65rem;
}

.founding-hero {
  background: linear-gradient(160deg, #0a1628 0%, #0d1a38 50%, #0a1220 100%);
  position: relative;
}

.founding-jump-links {
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
  margin-top: 2rem;
  display: flex;
}

.founding-jump-btn {
  color: #e5e7eb;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 10px;
  align-items: center;
  gap: .5rem;
  padding: .65rem 1.25rem;
  font-size: .9rem;
  font-weight: 500;
  text-decoration: none;
  transition: border-color .2s, background .2s, transform .15s;
  display: inline-flex;
}

.founding-jump-btn:hover {
  background: rgba(6, 214, 160, .08);
  border-color: rgba(6, 214, 160, .4);
  transform: translateY(-2px);
}

.founding-role-section {
  padding: 5rem 2rem;
}

.founding-role-alt {
  background: rgba(255, 255, 255, .016);
  border-top: 1px solid rgba(255, 255, 255, .07);
  border-bottom: 1px solid rgba(255, 255, 255, .07);
}

.founding-role-header {
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 1.5rem;
  margin-bottom: .5rem;
  display: flex;
}

.founding-role-icon {
  flex-shrink: 0;
  margin-top: .25rem;
  font-size: 2.5rem;
}

.founding-tiers-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.75rem;
  display: grid;
}

.founding-tier-card {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 16px;
  flex-direction: column;
  padding: 1.75rem;
  transition: border-color .2s, transform .2s;
  display: flex;
  position: relative;
}

.founding-tier-card:hover {
  border-color: rgba(255, 255, 255, .15);
  transform: translateY(-3px);
}

.founding-tier-featured {
  box-shadow: 0 0 40px rgba(255, 107, 53, .08);
  background: rgba(255, 107, 53, .06) !important;
  border-color: rgba(255, 107, 53, .35) !important;
}

.founding-popular-badge {
  color: #fff;
  text-transform: uppercase;
  letter-spacing: .06em;
  white-space: nowrap;
  background: #ff6b35;
  border-radius: 20px;
  padding: .25rem .75rem;
  font-size: .7rem;
  font-weight: 700;
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
}

.founding-tier-name {
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #6b7280;
  margin-bottom: .75rem;
  font-size: .8rem;
  font-weight: 700;
}

.founding-spot-bar-wrap {
  flex-direction: column;
  gap: .35rem;
  margin-bottom: 1.25rem;
  display: flex;
}

.founding-spot-bar-track {
  background: rgba(255, 255, 255, .08);
  border-radius: 3px;
  height: 5px;
  overflow: hidden;
}

.founding-spot-bar-fill {
  border-radius: 3px;
  height: 100%;
  transition: width .4s;
}

.founding-spot-label {
  color: #6b7280;
  font-size: .78rem;
}

.founding-price {
  color: #f9fafb;
  align-items: baseline;
  gap: .4rem;
  margin-bottom: .5rem;
  font-size: 2.5rem;
  font-weight: 900;
  line-height: 1;
  display: flex;
}

.founding-price-once {
  color: #6b7280;
  font-size: .85rem;
  font-weight: 400;
}

.founding-saves {
  color: #6b7280;
  margin-bottom: 1rem;
  font-size: .82rem;
  line-height: 1.4;
}

.founding-features {
  margin: 1rem 0 auto;
}

.founding-features .mktg-pf {
  font-size: .87rem;
}

.founding-checkout-wrap {
  margin-top: 1.5rem;
}

.founding-claim-btn {
  cursor: pointer;
  color: #f9fafb;
  background: rgba(255, 255, 255, .08);
  border: none;
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-top: .75rem;
  padding: .8rem 1.25rem;
  font-size: .92rem;
  font-weight: 700;
  transition: background .2s, transform .15s;
  display: flex;
}

.founding-claim-btn:hover {
  background: rgba(255, 255, 255, .14);
  transform: translateY(-1px);
}

.founding-claim-btn--featured {
  color: #fff;
  background: linear-gradient(135deg, #ff6b35, #f59e0b);
}

.founding-claim-btn--featured:hover {
  opacity: .92;
}

.founding-guarantee-strip {
  background: rgba(6, 214, 160, .05);
  border: 1px solid rgba(6, 214, 160, .15);
  border-radius: 14px;
  align-items: flex-start;
  gap: 1.25rem;
  max-width: 720px;
  margin: 0 auto;
  padding: 1.5rem 2rem;
  display: flex;
}

.founding-faq-list {
  flex-direction: column;
  gap: 0;
  margin-top: 2rem;
  display: flex;
}

.founding-faq-item {
  border-bottom: 1px solid rgba(255, 255, 255, .07);
  padding: 1.25rem 0;
}

.founding-faq-item:last-child {
  border-bottom: none;
}

.founding-faq-item h3 {
  color: #f9fafb;
  margin-bottom: .5rem;
  font-size: 1rem;
  font-weight: 600;
}

.founding-faq-item p {
  color: #9ca3af;
  margin: 0;
  font-size: .9rem;
  line-height: 1.65;
}

@media (width <= 768px) {
  .founding-role-header {
    flex-direction: column;
    gap: 1rem;
  }

  .founding-role-icon {
    font-size: 2rem;
  }

  .founding-tiers-grid {
    grid-template-columns: 1fr;
  }

  .founding-jump-links {
    gap: .65rem;
  }

  .founding-jump-btn {
    padding: .55rem 1rem;
    font-size: .82rem;
  }

  .founding-guarantee-strip {
    flex-direction: column;
    padding: 1.25rem;
  }
}

.beta-criteria-card {
  background: rgba(255, 255, 255, .03);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 14px;
  padding: 1.5rem;
}

.beta-criteria-yes {
  background: rgba(6, 214, 160, .04) !important;
  border-color: rgba(6, 214, 160, .2) !important;
}

.beta-criteria-no {
  background: rgba(239, 68, 68, .03) !important;
  border-color: rgba(239, 68, 68, .15) !important;
}

.beta-criteria-label {
  align-items: center;
  gap: .5rem;
  margin-bottom: 1rem;
  font-size: .9rem;
  font-weight: 700;
  display: flex;
}

.beta-criteria-list {
  flex-direction: column;
  gap: .6rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.beta-criteria-list li {
  color: #d1d5db;
  padding-left: 1rem;
  font-size: .87rem;
  position: relative;
}

.beta-criteria-list li:before {
  content: "—";
  color: #4b5563;
  font-size: .75rem;
  position: absolute;
  left: 0;
}

.beta-form {
  flex-direction: column;
  gap: 1.5rem;
  display: flex;
}

.beta-form-row {
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
  display: grid;
}

.beta-field {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.beta-label {
  color: #e5e7eb;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .25rem;
  font-size: .85rem;
  font-weight: 600;
  display: flex;
}

.beta-required {
  color: #ff6b35;
  font-size: .8rem;
}

.beta-input {
  color: #f9fafb;
  box-sizing: border-box;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 10px;
  outline: none;
  width: 100%;
  padding: .8rem 1rem;
  font-family: inherit;
  font-size: .92rem;
  transition: border-color .2s, background .2s;
}

.beta-input:focus {
  background: rgba(6, 214, 160, .04);
  border-color: rgba(6, 214, 160, .4);
}

.beta-select {
  cursor: pointer;
  appearance: none;
}

.beta-textarea {
  resize: vertical;
  min-height: 110px;
  line-height: 1.6;
}

.beta-field-hint {
  color: #6b7280;
  font-size: .77rem;
}

.beta-radio-group {
  flex-direction: column;
  gap: .6rem;
  display: flex;
}

.beta-radio-label {
  color: #d1d5db;
  cursor: pointer;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 8px;
  align-items: center;
  gap: .6rem;
  padding: .65rem 1rem;
  font-size: .9rem;
  transition: border-color .15s, background .15s;
  display: flex;
}

.beta-radio-label:hover {
  background: rgba(6, 214, 160, .04);
  border-color: rgba(6, 214, 160, .3);
}

.beta-radio-label input {
  accent-color: #06d6a0;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
}

.beta-error-msg {
  color: #fca5a5;
  background: rgba(239, 68, 68, .08);
  border: 1px solid rgba(239, 68, 68, .2);
  border-radius: 8px;
  align-items: flex-start;
  gap: .5rem;
  padding: .85rem 1rem;
  font-size: .88rem;
  line-height: 1.5;
  display: flex;
}

.beta-submit-btn {
  cursor: pointer;
  color: #fff;
  background: linear-gradient(135deg, #06d6a0, #3b82f6);
  border: none;
  border-radius: 12px;
  justify-content: center;
  align-items: center;
  gap: .6rem;
  width: 100%;
  padding: 1rem 1.5rem;
  font-size: 1rem;
  font-weight: 700;
  transition: opacity .2s, transform .15s;
  display: flex;
}

.beta-submit-btn:hover {
  opacity: .9;
  transform: translateY(-1px);
}

.beta-form-disclaimer {
  color: #6b7280;
  text-align: center;
  font-size: .78rem;
  line-height: 1.6;
}

.beta-success-wrap {
  text-align: center;
  background: rgba(6, 214, 160, .05);
  border: 1px solid rgba(6, 214, 160, .15);
  border-radius: 16px;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding: 3rem 2rem;
  display: flex;
}

.beta-success-wrap h3 {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 700;
}

.beta-success-wrap p {
  color: #9ca3af;
  max-width: 480px;
  margin: 0;
  line-height: 1.65;
}

.beta-callout-strip {
  background: linear-gradient(135deg, rgba(6, 214, 160, .08), rgba(59, 130, 246, .06));
  border: 1px solid rgba(6, 214, 160, .15);
  border-radius: 16px;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 2rem;
  max-width: 960px;
  margin: 3rem auto;
  padding: 2rem 2.5rem;
  display: flex;
}

.beta-callout-strip-icon {
  color: #06d6a0;
  font-variation-settings: "FILL" 1;
  flex-shrink: 0;
  font-size: 2.5rem;
}

.beta-callout-text {
  flex: 1;
  min-width: 240px;
}

.beta-callout-text strong {
  margin-bottom: .35rem;
  font-size: 1.05rem;
  font-weight: 700;
  display: block;
}

.beta-callout-text p {
  color: #9ca3af;
  margin: 0;
  font-size: .88rem;
}

.beta-callout-cta {
  color: #070d18;
  white-space: nowrap;
  background: #06d6a0;
  border-radius: 10px;
  align-items: center;
  gap: .5rem;
  padding: .75rem 1.5rem;
  font-size: .9rem;
  font-weight: 700;
  text-decoration: none;
  transition: opacity .15s, transform .15s;
  display: inline-flex;
}

.beta-callout-cta:hover {
  opacity: .9;
  transform: translateY(-1px);
}

@media (width <= 768px) {
  .beta-form-row {
    grid-template-columns: 1fr;
  }

  .beta-criteria-card {
    grid-column: span 1;
  }

  [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  .beta-callout-strip {
    text-align: center;
    flex-direction: column;
    padding: 1.5rem;
  }

  .beta-callout-strip-icon {
    margin: 0 auto;
  }
}

.ap-section {
  background: rgba(255, 255, 255, .01);
}

.ap-header {
  text-align: center;
  margin-bottom: 2rem;
}

.ap-kpi-row {
  grid-template-columns: repeat(4, 1fr);
  gap: .75rem;
  margin-bottom: 1.25rem;
  display: grid;
}

@media (width <= 640px) {
  .ap-kpi-row {
    grid-template-columns: repeat(2, 1fr);
  }
}

.ap-kpi {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: 10px;
  padding: .75rem;
}

.ap-kpi-val {
  color: #fff;
  font-size: 1.15rem;
  font-weight: 800;
}

.ap-kpi-label {
  color: var(--mk-muted);
  margin-top: .2rem;
  font-size: .72rem;
}

.ap-kpi-delta {
  margin-top: .3rem;
  font-size: .68rem;
  font-weight: 600;
}

.ap-delta--up {
  color: #06d6a0;
}

.ap-delta--warn {
  color: #ffbd2e;
}

.ap-delta--down {
  color: #ff453a;
}

.ap-section-title {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--mk-muted);
  margin: 1rem 0 .5rem;
  font-size: .72rem;
  font-weight: 700;
}

.ap-activity-list {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.ap-activity-row {
  background: rgba(255, 255, 255, .024);
  border-radius: 8px;
  align-items: center;
  gap: .6rem;
  padding: .45rem .5rem;
  transition: background .12s;
  display: flex;
}

.ap-activity-row:hover {
  background: rgba(255, 255, 255, .043);
}

.ap-activity-icon {
  border-radius: 7px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  font-size: .85rem;
  display: flex;
}

.ap-activity-body {
  flex: 1;
  min-width: 0;
}

.ap-activity-main {
  color: #e8eaf0;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .78rem;
  font-weight: 600;
  display: block;
  overflow: hidden;
}

.ap-activity-time {
  color: var(--mk-muted);
  margin-top: .1rem;
  font-size: .68rem;
  display: block;
}

.ap-activity-amt {
  color: var(--mk-muted);
  white-space: nowrap;
  font-size: .78rem;
  font-weight: 700;
}

.ap-amt--credit {
  color: #06d6a0;
}

.ap-amt--debit {
  color: #ff453a;
}

.ap-amt--warn {
  color: #ffbd2e;
}

.ap-tenant-header {
  align-items: flex-start;
  gap: .85rem;
  margin-bottom: 1rem;
  display: flex;
}

.ap-tenant-meta {
  flex: 1;
  min-width: 0;
}

.ap-tenant-name {
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
}

.ap-tenant-sub {
  color: var(--mk-muted);
  margin-top: .15rem;
  font-size: .75rem;
}

.ap-badge-row {
  flex-wrap: wrap;
  gap: .35rem;
  margin-top: .4rem;
  display: flex;
}

.ap-badge {
  border: 1px solid;
  border-radius: 5px;
  padding: 2px 7px;
  font-size: .65rem;
  font-weight: 700;
}

.ap-badge--green {
  color: #06d6a0;
  background: rgba(6, 214, 160, .1);
  border-color: rgba(6, 214, 160, .25);
}

.ap-badge--blue {
  color: #0a84ff;
  background: rgba(10, 132, 255, .1);
  border-color: rgba(10, 132, 255, .25);
}

.ap-badge--purple {
  color: #8b7fff;
  background: rgba(99, 79, 235, .12);
  border-color: rgba(99, 79, 235, .25);
}

.ap-badge--warn {
  color: #ffbd2e;
  background: rgba(255, 189, 46, .1);
  border-color: rgba(255, 189, 46, .25);
}

.ap-badge--gray {
  color: var(--mk-muted);
  background: rgba(255, 255, 255, .06);
  border-color: rgba(255, 255, 255, .1);
}

.ap-score-ring {
  background: rgba(255, 255, 255, .06);
  border: 2px solid rgba(6, 214, 160, .3);
  border-radius: 50%;
  flex-direction: column;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 62px;
  height: 62px;
  display: flex;
}

.ap-score-ring-val {
  color: #06d6a0;
  font-size: 1.1rem;
  font-weight: 800;
  line-height: 1;
}

.ap-score-ring-label {
  color: var(--mk-muted);
  text-align: center;
  font-size: .55rem;
}

.ap-stat-grid {
  grid-template-columns: repeat(4, 1fr);
  gap: .5rem;
  margin-bottom: 1rem;
  display: grid;
}

@media (width <= 480px) {
  .ap-stat-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.ap-stat {
  background: rgba(255, 255, 255, .03);
  border-radius: 8px;
  padding: .5rem .6rem;
}

.ap-stat-val {
  color: #fff;
  font-size: .95rem;
  font-weight: 700;
}

.ap-stat-lbl {
  color: var(--mk-muted);
  margin-top: .1rem;
  font-size: .65rem;
}

.ap-val--green {
  color: #06d6a0;
}

.ap-val--warn {
  color: #ffbd2e;
}

.ap-payment-list {
  flex-direction: column;
  gap: .3rem;
  display: flex;
}

.ap-pay-row {
  color: #e8eaf0;
  background: rgba(255, 255, 255, .024);
  border-radius: 6px;
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  padding: .4rem .5rem;
  font-size: .75rem;
  display: flex;
}

.ap-pay-status {
  font-size: .68rem;
  font-weight: 700;
}

.ap-pay--paid {
  color: #06d6a0;
}

.ap-ledger {
  flex-direction: column;
  gap: .3rem;
  display: flex;
}

.ap-ledger-row {
  color: #e8eaf0;
  background: rgba(255, 255, 255, .024);
  border-radius: 6px;
  justify-content: space-between;
  align-items: center;
  padding: .35rem .5rem;
  font-size: .75rem;
  display: flex;
}

.ap-pay-summary {
  grid-template-columns: repeat(4, 1fr);
  gap: .6rem;
  margin-bottom: 1rem;
  display: grid;
}

@media (width <= 600px) {
  .ap-pay-summary {
    grid-template-columns: repeat(2, 1fr);
  }
}

.ap-pay-sum-item {
  text-align: center;
}

.ap-pay-sum-val {
  color: #e8eaf0;
  font-size: 1.05rem;
  font-weight: 800;
}

.ap-pay-sum-lbl {
  color: var(--mk-muted);
  margin-top: .15rem;
  font-size: .68rem;
}

.ap-export-row {
  flex-wrap: wrap;
  gap: .6rem;
  margin-top: .85rem;
  display: flex;
}

.ap-export-btn {
  color: #e8eaf0;
  cursor: pointer;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 7px;
  padding: .4rem .85rem;
  font-size: .72rem;
  font-weight: 600;
  transition: background .12s;
}

.ap-export-btn:hover {
  background: rgba(255, 255, 255, .1);
}

.ap-filter-bar {
  flex-wrap: wrap;
  gap: .4rem;
  margin-bottom: .75rem;
  display: flex;
}

.ap-filter-chip {
  color: var(--mk-muted);
  cursor: pointer;
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 20px;
  padding: 3px 10px;
  font-size: .7rem;
  font-weight: 600;
}

.ap-chip--active {
  color: #0a84ff;
  background: rgba(10, 132, 255, .15);
  border-color: rgba(10, 132, 255, .35);
}

.ap-listing-grid {
  grid-template-columns: repeat(2, 1fr);
  gap: .6rem;
  display: grid;
}

@media (width <= 480px) {
  .ap-listing-grid {
    grid-template-columns: 1fr;
  }
}

.ap-listing-card {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: 10px;
  padding: .7rem;
}

.ap-listing-badge {
  letter-spacing: .05em;
  text-transform: uppercase;
  border-radius: 5px;
  margin-bottom: .4rem;
  padding: 2px 7px;
  font-size: .6rem;
  font-weight: 800;
  display: inline-block;
}

.ap-listing-name {
  color: #fff;
  font-size: .82rem;
  font-weight: 700;
}

.ap-listing-tenant {
  color: var(--mk-muted);
  margin-top: .2rem;
  font-size: .7rem;
}

.ap-listing-rent {
  color: #e8eaf0;
  margin-top: .3rem;
  font-size: .78rem;
  font-weight: 600;
}

.ap-listing-status {
  margin-top: .3rem;
  font-size: .68rem;
  font-weight: 600;
}

.ap-status--green {
  color: #06d6a0;
}

.ap-status--warn {
  color: #ffbd2e;
}

.ap-status--gray {
  color: var(--mk-muted);
}

.ap-wo-list {
  flex-direction: column;
  gap: .6rem;
  display: flex;
}

.ap-wo-card {
  background: rgba(255, 255, 255, .035);
  border-left: 3px solid rgba(0, 0, 0, 0);
  border-radius: 10px;
  padding: .75rem;
}

.ap-wo--open {
  border-left-color: #ffbd2e;
}

.ap-wo--review {
  border-left-color: #0a84ff;
}

.ap-wo--closed {
  opacity: .7;
  border-left-color: rgba(255, 255, 255, .12);
}

.ap-wo-header {
  align-items: center;
  gap: .5rem;
  margin-bottom: .4rem;
  display: flex;
}

.ap-wo-badge {
  text-transform: uppercase;
  border-radius: 5px;
  padding: 2px 7px;
  font-size: .62rem;
  font-weight: 800;
}

.ap-wo-badge--open {
  color: #ffbd2e;
  background: rgba(255, 189, 46, .15);
}

.ap-wo-badge--review {
  color: #0a84ff;
  background: rgba(10, 132, 255, .15);
}

.ap-wo-badge--closed {
  color: var(--mk-muted);
  background: rgba(255, 255, 255, .08);
}

.ap-wo-id {
  color: var(--mk-muted);
  font-family: monospace;
  font-size: .68rem;
}

.ap-wo-date {
  color: var(--mk-muted);
  margin-left: auto;
  font-size: .68rem;
}

.ap-wo-title {
  color: #e8eaf0;
  font-size: .82rem;
  font-weight: 700;
}

.ap-wo-meta {
  color: var(--mk-muted);
  margin-top: .2rem;
  font-size: .7rem;
}

.ap-wo-vendor-row {
  border-top: 1px solid rgba(255, 255, 255, .06);
  align-items: center;
  gap: .5rem;
  margin-top: .5rem;
  padding-top: .5rem;
  display: flex;
}

.ap-wo-vendor {
  color: #e8eaf0;
  flex: 1;
  font-size: .75rem;
}

.ap-wo-eta {
  color: #06d6a0;
  font-size: .68rem;
  font-weight: 700;
}

.ap-wo-invoice-row {
  color: #e8eaf0;
  border-top: 1px solid rgba(255, 255, 255, .06);
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  margin-top: .5rem;
  padding-top: .5rem;
  font-size: .75rem;
  display: flex;
}

.ap-wo-actions {
  gap: .4rem;
  display: flex;
}

.ap-btn-approve {
  color: #06d6a0;
  cursor: pointer;
  background: rgba(6, 214, 160, .15);
  border: 1px solid rgba(6, 214, 160, .3);
  border-radius: 6px;
  padding: 3px 9px;
  font-size: .68rem;
  font-weight: 700;
}

.ap-btn-reject {
  color: #ff453a;
  cursor: pointer;
  background: rgba(255, 69, 58, .1);
  border: 1px solid rgba(255, 69, 58, .25);
  border-radius: 6px;
  padding: 3px 9px;
  font-size: .68rem;
  font-weight: 700;
}

.ap-client-list {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.ap-client-row {
  background: rgba(255, 255, 255, .03);
  border-radius: 9px;
  align-items: center;
  gap: .65rem;
  padding: .55rem .6rem;
  display: flex;
}

.ap-client-meta {
  flex: 1;
  min-width: 0;
}

.ap-client-name {
  color: #fff;
  font-size: .82rem;
  font-weight: 700;
}

.ap-client-sub {
  color: var(--mk-muted);
  margin-top: .1rem;
  font-size: .7rem;
}

.ap-client-stats {
  flex-direction: column;
  align-items: flex-end;
  gap: .2rem;
  display: flex;
}

.ap-client-fee {
  color: var(--mk-muted);
  font-size: .72rem;
  font-weight: 600;
}

.ap-portal-header {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: 9px;
  justify-content: space-between;
  align-items: center;
  margin-bottom: .85rem;
  padding: .6rem .75rem;
  display: flex;
}

.ap-portal-logo {
  color: #fff;
  font-size: .85rem;
  font-weight: 800;
}

.ap-portal-owner {
  color: var(--mk-muted);
  font-size: .75rem;
}

.ap-trust-accounts {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.ap-trust-row {
  background: rgba(255, 255, 255, .035);
  border-radius: 9px;
  flex-wrap: wrap;
  align-items: center;
  gap: .6rem;
  padding: .55rem .65rem;
  display: flex;
}

.ap-trust-client {
  color: #e8eaf0;
  flex: 1;
  min-width: 120px;
  font-size: .8rem;
  font-weight: 700;
}

.ap-trust-balance {
  color: #fff;
  font-size: .9rem;
  font-weight: 800;
}

.ap-disburse-btn {
  color: #06d6a0;
  cursor: pointer;
  background: rgba(6, 214, 160, .12);
  border: 1px solid rgba(6, 214, 160, .25);
  border-radius: 6px;
  margin-left: auto;
  padding: 3px 10px;
  font-size: .7rem;
  font-weight: 700;
}

.mktg-nav-links > a.mktg-nav--active {
  color: var(--mk-text);
  position: relative;
}

.mktg-nav-links > a.mktg-nav--active:after {
  content: "";
  background: var(--mk-accent, #ff6b35);
  border-radius: 2px;
  height: 2px;
  animation: .18s forwards nav-spy-in;
  position: absolute;
  bottom: -4px;
  left: 0;
  right: 0;
}

@keyframes nav-spy-in {
  from {
    opacity: 0;
    transform: scaleX(.4);
  }

  to {
    opacity: 1;
    transform: scaleX(1);
  }
}

.asp-outer {
  max-width: 900px;
  margin: 0 auto;
}

.asp-caption {
  text-align: center;
  color: var(--mk-muted);
  margin-bottom: 1.25rem;
  font-size: .75rem;
  font-style: italic;
}

.asp-radio {
  opacity: 0;
  pointer-events: none;
  width: 0;
  height: 0;
  position: absolute;
}

.asp-tabs {
  background: #1a1d27;
  border: 1px solid #2a2d3a;
  border-radius: 10px 10px 0 0;
  flex-wrap: wrap;
  gap: .3rem;
  padding: .5rem .6rem .4rem;
  display: flex;
  overflow: hidden;
}

.asp-tab-label {
  color: #64748b;
  cursor: pointer;
  white-space: nowrap;
  -webkit-user-select: none;
  user-select: none;
  border-radius: 7px;
  align-items: center;
  gap: .35rem;
  padding: .45rem .85rem;
  font-size: .8rem;
  font-weight: 500;
  transition: background .12s, color .12s;
  display: flex;
}

.asp-tab-label:hover {
  color: #818cf8;
  background: rgba(99, 102, 241, .08);
}

.asp-radio:checked + .asp-tab-label {
  color: #818cf8;
  background: rgba(99, 102, 241, .15);
  font-weight: 600;
}

.asp-window {
  background: #0f1117;
  border: 1px solid #2a2d3a;
  border-top: none;
  border-radius: 0 0 12px 12px;
  overflow: hidden;
}

.asp-chrome-bar {
  background: #13161f;
  border-bottom: 1px solid #2a2d3a;
  align-items: center;
  gap: .5rem;
  padding: .5rem .75rem;
  display: flex;
}

.asp-dot {
  border-radius: 50%;
  width: 11px;
  height: 11px;
}

.asp-dot-red {
  background: #ff5f57;
}

.asp-dot-yellow {
  background: #ffbd2e;
}

.asp-dot-green {
  background: #28ca41;
}

.asp-url {
  color: #64748b;
  background: rgba(255, 255, 255, .04);
  border: 1px solid #2a2d3a;
  border-radius: 5px;
  margin-left: .5rem;
  padding: 2px 10px;
  font-family: monospace;
  font-size: .72rem;
}

.asp-shell {
  grid-template-columns: 200px 1fr;
  min-height: 360px;
  display: grid;
}

.asp-sidebar {
  background: #1a1d27;
  border-right: 1px solid #2a2d3a;
  flex-direction: column;
  gap: .15rem;
  padding: 1rem .75rem;
  display: flex;
}

.asp-sidebar-logo {
  color: #818cf8;
  border-bottom: 1px solid #2a2d3a;
  margin-bottom: .35rem;
  padding: 0 .5rem .75rem;
  font-size: .95rem;
  font-weight: 800;
}

.asp-sidebar-logo span {
  color: #64748b;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: .65rem;
  font-weight: 600;
  display: block;
}

.asp-nav-item {
  color: #64748b;
  border-radius: 6px;
  align-items: center;
  gap: .55rem;
  padding: .45rem .65rem;
  font-size: .8rem;
  text-decoration: none;
  transition: background .12s, color .12s;
  display: flex;
}

.asp-nav-item:hover {
  color: #818cf8;
  background: rgba(99, 102, 241, .08);
}

.asp-nav-item--active {
  color: #818cf8;
  background: rgba(99, 102, 241, .14);
  font-weight: 600;
}

.asp-nav-icon {
  text-align: center;
  flex-shrink: 0;
  width: 1rem;
  font-size: .9rem;
}

.asp-main {
  padding: 1.25rem 1.5rem;
  overflow: hidden;
}

.asp-page-title {
  color: #e2e8f0;
  margin-bottom: .25rem;
  font-size: 1rem;
  font-weight: 700;
}

.asp-page-sub {
  color: #64748b;
  margin-bottom: 1rem;
  font-size: .72rem;
}

.asp-panel {
  display: none;
}

#lp-t1:checked ~ .asp-window .asp-panel[data-tab="1"], #lp-t2:checked ~ .asp-window .asp-panel[data-tab="2"], #lp-t3:checked ~ .asp-window .asp-panel[data-tab="3"], #lp-t4:checked ~ .asp-window .asp-panel[data-tab="4"], #lp-t5:checked ~ .asp-window .asp-panel[data-tab="5"], #lp-t6:checked ~ .asp-window .asp-panel[data-tab="6"], #pm-t1:checked ~ .asp-window .asp-panel[data-tab="1"], #pm-t2:checked ~ .asp-window .asp-panel[data-tab="2"], #pm-t3:checked ~ .asp-window .asp-panel[data-tab="3"], #pm-t4:checked ~ .asp-window .asp-panel[data-tab="4"], #pm-t5:checked ~ .asp-window .asp-panel[data-tab="5"], #br-t1:checked ~ .asp-window .asp-panel[data-tab="1"], #br-t2:checked ~ .asp-window .asp-panel[data-tab="2"], #br-t3:checked ~ .asp-window .asp-panel[data-tab="3"], #br-t4:checked ~ .asp-window .asp-panel[data-tab="4"], #br-t5:checked ~ .asp-window .asp-panel[data-tab="5"] {
  display: block;
}

.asp-stat-grid {
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: .65rem;
  margin-bottom: 1rem;
  display: grid;
}

.asp-stat-card {
  background: #1a1d27;
  border: 1px solid #2a2d3a;
  border-radius: 8px;
  padding: .75rem;
}

.asp-stat-icon {
  margin-bottom: .3rem;
  font-size: 1.2rem;
}

.asp-stat-label {
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: .65rem;
}

.asp-stat-value {
  color: #e2e8f0;
  margin-top: .1rem;
  font-size: 1.15rem;
  font-weight: 700;
}

.asp-stat-delta {
  margin-top: .15rem;
  font-size: .65rem;
  font-weight: 600;
}

.asp-delta-up {
  color: #22c55e;
}

.asp-delta-warn {
  color: #f59e0b;
}

.asp-delta-down {
  color: #f87171;
}

.asp-table {
  border-collapse: collapse;
  width: 100%;
  font-size: .78rem;
}

.asp-table th {
  text-align: left;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #64748b;
  border-bottom: 1px solid #2a2d3a;
  padding: .4rem .6rem;
  font-size: .65rem;
  font-weight: 700;
}

.asp-table td {
  color: #e2e8f0;
  vertical-align: middle;
  border-bottom: 1px solid rgba(42, 45, 58, .6);
  padding: .5rem .6rem;
}

.asp-table tr:last-child td {
  border-bottom: none;
}

.asp-table tr:hover td {
  background: rgba(255, 255, 255, .02);
}

.asp-status {
  white-space: nowrap;
  border: 1px solid;
  border-radius: 5px;
  align-items: center;
  gap: .25rem;
  padding: 2px 7px;
  font-size: .65rem;
  font-weight: 700;
  display: inline-flex;
}

.asp-status--green {
  color: #22c55e;
  background: rgba(34, 197, 94, .1);
  border-color: rgba(34, 197, 94, .25);
}

.asp-status--warn {
  color: #f59e0b;
  background: rgba(245, 158, 11, .1);
  border-color: rgba(245, 158, 11, .25);
}

.asp-status--blue {
  color: #818cf8;
  background: rgba(99, 102, 241, .12);
  border-color: rgba(99, 102, 241, .3);
}

.asp-status--red {
  color: #f87171;
  background: rgba(248, 113, 113, .1);
  border-color: rgba(248, 113, 113, .3);
}

.asp-status--gray {
  color: #64748b;
  background: rgba(100, 116, 139, .1);
  border-color: rgba(100, 116, 139, .25);
}

.asp-section-hdr {
  letter-spacing: .07em;
  text-transform: uppercase;
  color: #64748b;
  margin: .85rem 0 .5rem;
  font-size: .68rem;
  font-weight: 700;
}

.asp-section-hdr:first-child {
  margin-top: 0;
}

.asp-card {
  background: #1a1d27;
  border: 1px solid #2a2d3a;
  border-radius: 8px;
  margin-bottom: .6rem;
  padding: .85rem 1rem;
}

.asp-card-title {
  color: #e2e8f0;
  font-size: .85rem;
  font-weight: 600;
}

.asp-card-sub {
  color: #64748b;
  margin-top: .15rem;
  font-size: .72rem;
}

.asp-card-row {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  display: flex;
}

.asp-credit {
  color: #22c55e;
  font-weight: 700;
}

.asp-debit {
  color: #f87171;
  font-weight: 700;
}

.asp-muted {
  color: #64748b;
}

.asp-btn {
  cursor: pointer;
  border: 1px solid;
  border-radius: 6px;
  padding: 3px 10px;
  font-size: .7rem;
  font-weight: 700;
  transition: background .12s;
}

.asp-btn-approve {
  color: #22c55e;
  background: rgba(34, 197, 94, .1);
  border-color: rgba(34, 197, 94, .3);
}

.asp-btn-neutral {
  color: #818cf8;
  background: rgba(99, 102, 241, .1);
  border-color: rgba(99, 102, 241, .3);
}

.asp-btn-export {
  color: #64748b;
  background: rgba(255, 255, 255, .04);
  border-color: #2a2d3a;
}

.asp-avatar {
  color: #818cf8;
  background: rgba(99, 102, 241, .2);
  border-radius: 8px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  font-size: .75rem;
  font-weight: 800;
  display: flex;
}

.asp-avatar-lg {
  border-radius: 10px;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  font-size: 1rem;
  font-weight: 800;
}

.asp-callout {
  color: #64748b;
  background: rgba(99, 102, 241, .06);
  border: 1px solid rgba(99, 102, 241, .2);
  border-radius: 8px;
  margin-top: .75rem;
  padding: .55rem .75rem;
  font-size: .72rem;
  line-height: 1.5;
}

.asp-callout strong {
  color: #818cf8;
}

@media (width <= 600px) {
  .asp-shell {
    grid-template-columns: 1fr;
  }

  .asp-sidebar {
    display: none;
  }
}

.press {
  transition: transform .14s ease-out;
}

.press:active {
  transform: scale(.97);
}

@media (prefers-reduced-motion: reduce) {
  .press, .folio-sheet, .folio-sheet-overlay, .photo-lightbox {
    transition: none !important;
  }

  .press:active {
    transform: none;
  }
}

.status-pill {
  text-transform: uppercase;
  letter-spacing: .05em;
  border: 1px solid;
  border-radius: .25rem;
  align-items: center;
  gap: .25rem;
  padding: .1rem .5rem;
  font-size: .59375rem;
  font-weight: 700;
  display: inline-flex;
}

.status-pill--ok {
  color: var(--green);
  background: rgba(104, 219, 169, .2);
  border-color: rgba(133, 248, 196, .4);
}

.status-pill--warn {
  color: #c05e00;
  background: rgba(247, 147, 26, .12);
  border-color: rgba(247, 147, 26, .3);
}

.status-pill--danger {
  color: var(--on-error-container);
  border-color: var(--error-container);
  background: rgba(255, 218, 214, .6);
}

.status-pill--neutral {
  background: var(--surface-container-highest);
  color: var(--on-surface-variant);
  border-color: rgba(198, 198, 205, .3);
}

.status-pill--info {
  color: #3f465c;
  background: rgba(186, 200, 237, .2);
  border-color: rgba(186, 200, 237, .4);
}

.hub-activity-rail {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .25);
  border-radius: 1rem;
  overflow: hidden;
}

.hub-activity-rail__head {
  border-bottom: 1px solid var(--surface-container-low);
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1.25rem;
  display: flex;
}

.hub-activity-rail__title {
  margin: 0;
  font-size: .875rem;
  font-weight: 700;
}

.hub-activity-rail__all {
  color: var(--on-surface);
  font-size: .75rem;
  font-weight: 700;
  text-decoration: none;
}

.hub-activity-rail__all:hover {
  text-decoration: underline;
}

.hub-activity-rail__hint {
  color: var(--on-surface-variant);
  margin: 0;
  padding: .25rem 0 0;
  font-size: .625rem;
}

.hub-activity-rail__list {
  flex-direction: column;
  display: flex;
}

.hub-activity-rail__row {
  color: inherit;
  border-top: 1px solid var(--surface-container-low);
  align-items: flex-start;
  gap: .75rem;
  padding: .875rem 1.25rem;
  text-decoration: none;
  display: flex;
}

.hub-activity-rail__row:hover {
  background: var(--surface-container-low);
}

.hub-activity-rail__row-title {
  margin: 0;
  font-size: .875rem;
  font-weight: 600;
}

.hub-activity-rail__row-meta {
  color: var(--on-surface-variant);
  margin: .25rem 0 0;
  font-size: .75rem;
}

.folio-empty--compact {
  text-align: center;
  color: var(--on-surface-variant);
  padding: 1.25rem;
  font-size: .875rem;
}

.folio-sheet-overlay {
  z-index: 1100;
  opacity: 0;
  pointer-events: none;
  background: rgba(0, 0, 0, .45);
  transition: opacity .25s;
  position: fixed;
  inset: 0;
}

.folio-sheet-overlay--open {
  opacity: 1;
  pointer-events: auto;
}

.folio-sheet {
  inset-block: 0;
  z-index: 1110;
  background: var(--surface-container-lowest);
  flex-direction: column;
  width: 100%;
  max-width: 28rem;
  transition: transform .28s cubic-bezier(.32, .72, 0, 1);
  display: flex;
  position: fixed;
  right: 0;
  transform: translateX(100%);
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
}

@media (width >= 768px) {
  .folio-sheet {
    max-width: 32rem;
  }
}

@media (width >= 1024px) {
  .folio-sheet {
    max-width: 36rem;
  }
}

.folio-sheet--wide {
  max-width: 100%;
}

@media (width >= 768px) {
  .folio-sheet--wide {
    max-width: 32rem;
  }
}

@media (width >= 1024px) {
  .folio-sheet--wide {
    max-width: 40rem;
  }
}

.folio-sheet--open {
  transform: translateX(0);
}

.folio-sheet__header {
  border-bottom: 1px solid var(--surface-container-high);
  flex-shrink: 0;
  align-items: flex-start;
  gap: .75rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.folio-sheet__title {
  margin: 0;
  font-size: .875rem;
  font-weight: 700;
}

.folio-sheet__subtitle {
  color: var(--on-surface-variant);
  margin: .25rem 0 0;
  font-size: .75rem;
}

.folio-sheet__close {
  cursor: pointer;
  width: 2.25rem;
  height: 2.25rem;
  color: var(--on-surface-variant);
  background: none;
  border: none;
  border-radius: 9999px;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  display: flex;
}

.folio-sheet__close:hover {
  background: var(--surface-container-low);
}

.folio-sheet__body {
  flex: 1;
  padding: 1.25rem;
  overflow-y: auto;
}

.folio-sheet__grid {
  gap: 1rem;
  display: grid;
}

@media (width >= 768px) {
  .folio-sheet__grid--2 {
    grid-template-columns: 1fr 1fr;
  }
}

.folio-sheet__footer {
  border-top: 1px solid var(--surface-container-high);
  flex-shrink: 0;
  justify-content: flex-end;
  gap: .5rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.photo-strip {
  gap: .5rem;
  padding-bottom: .25rem;
  display: flex;
  overflow-x: auto;
}

.photo-strip__tile {
  cursor: pointer;
  background: var(--surface-container-highest);
  border: none;
  border-radius: .5rem;
  flex-shrink: 0;
  width: 5.5rem;
  height: 5.5rem;
  padding: 0;
  position: relative;
  overflow: hidden;
}

.photo-strip__tile img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.photo-strip__cap {
  color: #fff;
  text-align: left;
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(25, 28, 30, .75));
  padding: .2rem .35rem;
  font-size: .5625rem;
  font-weight: 700;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.photo-strip__add {
  background: var(--surface);
  width: 5.5rem;
  height: 5.5rem;
  color: var(--on-surface-variant);
  cursor: pointer;
  border: 1.5px dashed rgba(198, 198, 205, .7);
  border-radius: .5rem;
  flex-direction: column;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  gap: .25rem;
  font-size: .65rem;
  font-weight: 700;
  display: flex;
}

.photo-lightbox {
  z-index: 60;
  background: rgba(0, 0, 0, .85);
  justify-content: center;
  align-items: center;
  padding: 1.5rem;
  display: none;
  position: fixed;
  inset: 0;
}

.photo-lightbox--open {
  display: flex;
}

.photo-lightbox__close {
  color: #fff;
  cursor: pointer;
  background: rgba(255, 255, 255, .15);
  border: none;
  border-radius: 9999px;
  justify-content: center;
  align-items: center;
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  position: absolute;
  top: 1rem;
  right: 1rem;
}

.photo-lightbox__figure {
  text-align: center;
  max-width: min(90vw, 48rem);
  margin: 0;
}

.photo-lightbox__figure img {
  border-radius: .5rem;
  max-width: 100%;
  max-height: 80vh;
}

.photo-lightbox__figure figcaption {
  color: var(--surface-container-highest);
  margin-top: .75rem;
  font-size: .875rem;
}

.proj-page {
  max-width: 64rem;
  margin: 0 auto;
}

.proj-kpi-grid {
  grid-template-columns: repeat(2, 1fr);
  gap: .75rem;
  margin-bottom: 1.5rem;
  display: grid;
}

@media (width >= 1024px) {
  .proj-kpi-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.proj-layout {
  gap: 1.5rem;
  display: grid;
}

@media (width >= 1024px) {
  .proj-layout {
    grid-template-columns: 2fr 1fr;
    align-items: start;
  }
}

.proj-section {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .25);
  border-radius: 1rem;
  overflow: hidden;
}

.proj-section__head {
  border-bottom: 1px solid var(--surface-container-low);
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.proj-section__title {
  margin: 0;
  font-size: .875rem;
  font-weight: 700;
}

.proj-section__hint {
  color: var(--on-surface-variant);
  margin: .25rem 0 0;
  font-size: .625rem;
}

.proj-section__body {
  flex-direction: column;
  gap: .35rem;
  padding: 1rem 1.25rem 1.25rem;
  display: flex;
}

.proj-section__body--stack {
  gap: .75rem;
}

.proj-section:has( > .proj-section__body) > .proj-section__head {
  border-bottom: none;
  padding-bottom: 0;
}

.proj-section:has( > .unit-actions) > .proj-section__head {
  border-bottom: none;
  padding-bottom: 0;
}

.proj-section:has( > .folio-form) > .proj-section__head {
  border-bottom: none;
  padding-bottom: 0;
}

.proj-section:has( > .maint-hist__receipt) > .proj-section__head {
  border-bottom: none;
  padding-bottom: 0;
}

.proj-section > .unit-actions {
  margin: 0;
  padding: 1rem 1.25rem 1.25rem;
}

.proj-section > .folio-form {
  box-shadow: none;
  background: none;
  border: none;
  border-radius: 0;
  padding: 0 1.25rem 1.25rem;
}

.proj-section > .maint-hist__receipt {
  margin: 0 1.25rem 1.25rem;
}

.proj-timeline {
  flex-direction: column;
  gap: 1rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.proj-timeline__item {
  color: inherit;
  padding-left: 1.25rem;
  text-decoration: none;
  position: relative;
}

.proj-timeline__item:before {
  content: "";
  background: var(--surface-container-high);
  width: 2px;
  position: absolute;
  top: .4rem;
  bottom: -1rem;
  left: .35rem;
}

.proj-timeline__item:last-child:before {
  display: none;
}

.proj-timeline__dot {
  background: var(--surface-container-highest);
  width: .75rem;
  height: .75rem;
  box-shadow: 0 0 0 1px var(--outline-variant);
  border: 2px solid #fff;
  border-radius: 50%;
  position: absolute;
  top: .35rem;
  left: 0;
}

.proj-timeline__dot--done {
  background: var(--green);
}

.proj-timeline__dot--active {
  background: #f7931a;
}

.proj-timeline__dot--g27 {
  background: #3f465c;
}

.proj-timeline__dot--exp {
  background: var(--on-error-container);
}

.proj-g27-dims {
  flex-direction: column;
  gap: .625rem;
  display: flex;
}

.proj-dim-bar {
  background: var(--surface-container-highest);
  border-radius: 999px;
  height: 6px;
  overflow: hidden;
}

.proj-dim-bar > i {
  background: var(--navy);
  border-radius: 999px;
  height: 100%;
  display: block;
}

.proj-budget-bar {
  background: var(--surface-container-highest);
  border-radius: 999px;
  height: 8px;
  margin-top: .5rem;
  overflow: hidden;
}

.proj-budget-bar > i {
  background: var(--navy);
  border-radius: 999px;
  height: 100%;
  display: block;
}

.proj-budget-bar > i.over {
  background: var(--on-error-container);
}

.ratings-page {
  max-width: 42rem;
  margin: 0 auto;
}

.ratings-session {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .25);
  border-radius: 1rem;
  overflow: hidden;
}

.ratings-session__head {
  border-bottom: 1px solid var(--surface-container-low);
  gap: .75rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.ratings-photos {
  border-bottom: 1px solid var(--surface-container-low);
  background: rgba(242, 244, 246, .4);
  padding: 1rem 1.25rem;
}

.hub-overview {
  gap: 1.5rem;
  display: grid;
}

@media (width >= 1024px) {
  .hub-overview {
    grid-template-columns: 2fr 1fr;
    align-items: start;
  }
}

.hub-overview__main {
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.hub-title-row {
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  display: flex;
}

.hub-unit-row {
  color: inherit;
  border-top: 1px solid var(--surface-container-low);
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  text-decoration: none;
  display: flex;
}

.hub-unit-row:first-of-type {
  border-top: none;
}

.hub-unit-row:hover {
  background: var(--surface-container-low);
}

.hub-unit-tile {
  background: var(--navy);
  color: #fff;
  border-radius: .75rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 2.5rem;
  height: 2.5rem;
  font-size: .875rem;
  font-weight: 700;
  display: flex;
}

.hub-unit-row__body {
  flex: 1;
  min-width: 0;
}

.hub-unit-row__title-line {
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  display: flex;
}

.hub-unit-row__name {
  margin: 0;
  font-size: .9375rem;
  font-weight: 600;
}

.hub-unit-row__meta {
  color: var(--on-surface-variant);
  margin: .2rem 0 0;
  font-size: .75rem;
}

.hub-unit-row__side {
  text-align: right;
  flex-shrink: 0;
}

.hub-unit-row__rent {
  font-variant-numeric: tabular-nums;
  margin: 0;
  font-size: .875rem;
  font-weight: 700;
}

.hub-unit-row__wo {
  color: var(--on-surface-variant);
  margin: .15rem 0 0;
  font-size: .625rem;
  font-weight: 700;
}

.hub-unit-row__chevron {
  color: var(--on-surface-variant);
  flex-shrink: 0;
  font-size: 20px !important;
}

.hub-peek-split {
  gap: 1.5rem;
  display: grid;
}

@media (width >= 640px) {
  .hub-peek-split {
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
  }
}

.hub-mgmt-card {
  flex-direction: column;
  display: flex;
}

.hub-mgmt-card > .proj-section__head {
  border-bottom: none;
  padding-bottom: 0;
}

.hub-mgmt-body {
  flex-direction: column;
  flex: 1;
  gap: 1rem;
  padding: 1rem 1.25rem 1.25rem;
  display: flex;
}

.hub-mgmt-row {
  align-items: center;
  gap: .75rem;
  display: flex;
}

.hub-mgmt-row__text {
  flex: 1;
  min-width: 0;
}

.hub-mgmt-row .folio-btn {
  flex-shrink: 0;
  align-self: center;
}

.hub-mgmt-icon {
  background: var(--surface-container-high);
  width: 2.25rem;
  height: 2.25rem;
  color: var(--on-surface-variant);
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 20;
  text-align: center;
  border-radius: 999px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  font-size: 18px !important;
  line-height: 1 !important;
  display: inline-flex !important;
}

.hub-mgmt-card .folio-btn:disabled, .hub-mgmt-card .folio-btn[disabled] {
  opacity: .45;
  background: var(--surface-container-low);
  width: 100%;
  color: var(--outline);
  cursor: not-allowed;
  border-color: rgba(0, 0, 0, 0);
  margin-top: auto;
}

.hub-mgmt-label {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--on-surface-variant);
  margin: 0;
  font-size: .6rem;
  font-weight: 700;
}

.hub-mgmt-name {
  margin: .15rem 0 0;
  font-size: .875rem;
  font-weight: 600;
}

.hub-mgmt-name--muted {
  color: var(--on-surface-variant);
}

.hub-mgmt-meta {
  color: var(--on-surface-variant);
  margin: .1rem 0 0;
  font-size: .75rem;
}

.hub-expense-amount {
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
  font-size: .875rem;
}

.hub-archive-foot__ok {
  color: #15803d;
  margin: .75rem 0 0;
  font-size: .875rem;
}

.hub-more {
  position: relative;
}

.hub-more__menu {
  z-index: 30;
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .45);
  border-radius: .75rem;
  min-width: 12.5rem;
  padding: .25rem 0;
  position: absolute;
  top: calc(100% + .25rem);
  right: 0;
  box-shadow: 0 8px 24px rgba(25, 28, 30, .12);
}

.hub-more__item {
  text-align: left;
  cursor: pointer;
  width: 100%;
  color: var(--on-surface);
  background: none;
  border: none;
  padding: .65rem 1rem;
  font-size: .875rem;
  display: block;
}

.hub-more__item:hover {
  background: var(--surface-container-low);
}

.hub-more__item--danger {
  color: var(--on-error-container);
  font-weight: 600;
}

.hub-media-row {
  grid-template-columns: 1fr;
  gap: 1rem;
  margin-bottom: 1.5rem;
  display: grid;
}

@media (width >= 640px) {
  .hub-media-row {
    grid-template-columns: 1fr 1fr;
  }

  .hub-media-row > .hub-photo-strip {
    grid-column: 1 / -1;
  }
}

@media (width >= 1024px) {
  .hub-media-row {
    grid-template-columns: 1fr 1.15fr 1fr;
    align-items: stretch;
  }

  .hub-media-row > .hub-photo-strip {
    grid-column: auto;
  }
}

.hub-media-row--unit {
  grid-template-columns: 1fr;
}

@media (width >= 640px) {
  .hub-media-row--unit {
    grid-template-columns: 1fr;
  }

  .hub-media-row--unit > .hub-photo-strip {
    grid-column: auto;
  }
}

.hub-media-card {
  background: var(--surface-container-lowest);
  color: inherit;
  border: 1px dashed rgba(198, 198, 205, .7);
  border-radius: 1rem;
  align-items: center;
  gap: .75rem;
  padding: 1.1rem 1.25rem;
  text-decoration: none;
  display: flex;
}

.hub-media-card--files {
  flex-direction: column;
  align-items: stretch;
  gap: .85rem;
  min-width: 0;
}

.hub-media-card--files .hub-media-card__head {
  align-items: flex-start;
  gap: .75rem;
  display: flex;
}

.hub-media-card__icon {
  background: var(--surface-container-low);
  width: 2.5rem;
  height: 2.5rem;
  color: var(--on-surface-variant);
  border-radius: .65rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: flex;
}

.hub-media-card__icon .material-symbols-outlined {
  font-size: 1.35rem;
}

.hub-media-card__drop {
  background: var(--surface);
  text-align: center;
  color: var(--on-surface-variant);
  border: 1px dashed rgba(198, 198, 205, .85);
  border-radius: .65rem;
  padding: .85rem .75rem;
  font-size: .72rem;
  font-weight: 600;
}

.hub-media-card--drop-active {
  border-color: var(--on-surface);
  background: #f8fafc;
}

.hub-media-card--drop-active .hub-media-card__drop {
  border-color: var(--on-surface);
  background: #eef2f6;
}

.hub-media-card__actions {
  flex-wrap: wrap;
  gap: .35rem;
  display: flex;
}

.hub-photo-strip {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .45);
  border-radius: 1rem;
  flex-direction: column;
  gap: .75rem;
  min-width: 0;
  padding: .85rem 1rem 1rem;
  display: flex;
}

.hub-photo-strip__head {
  justify-content: space-between;
  align-items: flex-start;
  gap: .75rem;
  display: flex;
}

.hub-photo-strip__count {
  color: var(--on-surface-variant);
  margin: .15rem 0 0;
  font-size: .7rem;
  font-weight: 700;
}

.hub-photo-strip__thumbs {
  -webkit-overflow-scrolling: touch;
  gap: .4rem;
  padding-bottom: 2px;
  display: flex;
  overflow-x: auto;
}

.hub-photo-strip__thumb {
  background: #1a1c1e;
  border: 1px solid rgba(198, 198, 205, .45);
  border-radius: .55rem;
  flex: none;
  width: 4.25rem;
  height: 4.25rem;
  text-decoration: none;
  display: block;
  position: relative;
  overflow: hidden;
}

@media (width >= 1024px) {
  .hub-photo-strip__thumb {
    width: 4.75rem;
    height: 4.75rem;
  }
}

.hub-photo-strip__thumb img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.hub-photo-strip__thumb--cover:after {
  content: "Cover";
  color: #166534;
  background: #dcfce7;
  border-radius: 3px;
  padding: .08rem .28rem;
  font-size: .55rem;
  font-weight: 700;
  position: absolute;
  bottom: .25rem;
  left: .25rem;
}

.hub-photo-strip__thumb-fallback {
  color: #94a3b8;
  background: var(--surface-container-low);
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
}

.hub-photo-strip__empty {
  background: var(--surface-container-low);
  min-height: 4.25rem;
  color: var(--on-surface-variant);
  border-radius: .55rem;
  align-items: center;
  gap: .5rem;
  padding: .65rem .75rem;
  font-size: .75rem;
  font-weight: 600;
  display: flex;
}

.hub-media-card--photos {
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  padding: 0;
  overflow: hidden;
}

.hub-media-card__photo-empty {
  background: var(--surface-container-low);
  min-height: 7rem;
  color: var(--on-surface-variant);
  border-bottom: 1px dashed rgba(198, 198, 205, .55);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .35rem;
  font-size: .75rem;
  font-weight: 600;
  display: flex;
}

.hub-media-card__photo-empty .material-symbols-outlined {
  font-size: 2rem;
}

.hub-media-card__photo-empty--has {
  background: linear-gradient(135deg, #e8eef4, var(--surface-container-low));
}

.hub-media-card__photo-preview {
  background: #1a1c1e;
  border-bottom: 1px solid rgba(198, 198, 205, .35);
  min-height: 7rem;
  max-height: 11rem;
  position: relative;
  overflow: hidden;
}

.hub-media-card__photo-preview img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 11rem;
  display: block;
}

.hub-media-card__photo-busy {
  color: #fff;
  background: rgba(25, 28, 30, .72);
  border-radius: .35rem;
  padding: .2rem .45rem;
  font-size: .65rem;
  font-weight: 600;
  position: absolute;
  bottom: .5rem;
  right: .5rem;
}

.docs-photo-tile-wrap {
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.docs-photo-grid {
  grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
  gap: .75rem;
  margin: .5rem 0 1.25rem;
  display: grid;
}

.docs-photo-tile {
  background: var(--surface-container-lowest);
  cursor: pointer;
  text-align: left;
  border: 1px solid rgba(198, 198, 205, .4);
  border-radius: .75rem;
  flex-direction: column;
  gap: .35rem;
  padding: 0;
  display: flex;
  overflow: hidden;
}

.docs-photo-tile img {
  aspect-ratio: 4 / 3;
  -o-object-fit: cover;
  object-fit: cover;
  background: var(--surface-container-low);
  width: 100%;
  display: block;
}

.docs-photo-tile__meta {
  color: var(--on-surface-variant);
  padding: .45rem .55rem .55rem;
  font-size: .7rem;
}

.docs-photo-tile__meta strong {
  color: var(--on-surface);
  margin-bottom: .15rem;
  font-size: .75rem;
  display: block;
}

.hub-media-card__photo-foot {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  padding: .85rem 1.1rem;
  display: flex;
}

.hub-media-card__photo-foot-text {
  flex: 1;
  min-width: 8rem;
}

.hub-media-card__photo-foot-actions {
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  display: flex;
}

.hub-media-card__photo-foot-actions .folio-btn {
  align-items: center;
  gap: .3rem;
  display: inline-flex;
}

.docs-page__crumb {
  color: var(--on-surface-variant);
  flex-wrap: wrap;
  align-items: center;
  gap: .25rem;
  margin: 0 0 .75rem;
  font-size: .75rem;
  display: flex;
}

.docs-page__crumb a {
  color: var(--on-surface-variant);
  font-weight: 500;
  text-decoration: none;
}

.docs-page__crumb a:hover {
  color: var(--on-surface);
  text-decoration: underline;
}

.docs-page__identity {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .35);
  border-radius: .75rem;
  align-items: center;
  gap: .85rem;
  margin: 0 0 1rem;
  padding: .75rem 1rem;
  display: flex;
}

.docs-page__cover-slot {
  background: var(--surface-container-low);
  width: 3.5rem;
  height: 3.5rem;
  color: var(--on-surface-variant);
  border: 1.5px dashed rgba(198, 198, 205, .7);
  border-radius: .5rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: flex;
}

.docs-page__cover-slot--has {
  background: linear-gradient(135deg, #e8eef4, var(--surface-container-low));
  color: var(--on-surface);
  border-style: solid;
}

.docs-page__identity-text {
  flex: 1;
  min-width: 0;
}

.docs-page__identity-label {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--on-surface-variant);
  margin: 0;
  font-size: .6rem;
  font-weight: 700;
}

.docs-page__identity-place {
  color: var(--on-surface);
  margin: .2rem 0 0;
  font-size: .9rem;
  font-weight: 600;
}

.docs-page__identity-meta {
  color: var(--on-surface-variant);
  margin: .25rem 0 0;
  font-size: .75rem;
  line-height: 1.4;
}

.docs-page__identity + .status-pill {
  margin: 0 0 .75rem;
}

.docs-row-actions {
  flex-direction: column;
  flex-shrink: 0;
  align-items: flex-end;
  gap: .35rem;
  display: flex;
}

.hub-details-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  display: grid;
}

.proj-section:has( > .hub-details-grid) > .proj-section__head {
  border-bottom: none;
  padding-bottom: 0;
}

.proj-section > .hub-details-grid {
  padding: 1rem 1.25rem 1.25rem;
}

.proj-section > .hub-details-notes {
  margin: -.35rem 0 0;
  padding: 0 1.25rem 1.25rem;
}

@media (width >= 640px) {
  .hub-details-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.hub-details-grid--capital .hub-mgmt-name {
  font-variant-numeric: tabular-nums;
}

.hub-assign-vendor {
  background: var(--surface);
  border: 1px solid rgba(198, 198, 205, .35);
  border-radius: .75rem;
  margin: .25rem 0 .75rem;
  padding: .75rem;
}

.hub-assign-vendor__list {
  flex-direction: column;
  gap: .35rem;
  max-height: 12rem;
  display: flex;
  overflow-y: auto;
}

.hub-assign-vendor__option {
  text-align: left;
  background: var(--surface-container-lowest);
  cursor: pointer;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: .6rem;
  flex-direction: column;
  align-items: flex-start;
  gap: .15rem;
  width: 100%;
  padding: .55rem .7rem;
  display: flex;
}

.hub-assign-vendor__option:hover {
  border-color: rgba(198, 198, 205, .55);
}

.hub-media-card--map {
  border-style: solid;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  padding: 0;
  overflow: hidden;
}

.hub-media-card__map-visual {
  color: #fff;
  background: linear-gradient(135deg, rgba(6, 95, 70, .35), #1e293b);
  justify-content: center;
  align-items: center;
  gap: .5rem;
  min-height: 5.5rem;
  font-size: .875rem;
  font-weight: 700;
  display: flex;
}

.hub-media-card__map-foot {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  padding: .85rem 1.1rem;
  display: flex;
}

.hub-media-card__title {
  margin: 0;
  font-size: .875rem;
  font-weight: 700;
}

.hub-media-card__sub {
  color: var(--on-surface-variant);
  margin: .2rem 0 0;
  font-size: .75rem;
}

.hub-mini-map__canvas {
  background: #e8eef4;
  width: 100%;
  height: 8.5rem;
  min-height: 8.5rem;
}

.hub-mini-map__actions {
  flex-wrap: wrap;
  flex-shrink: 0;
  align-items: center;
  gap: .35rem;
  display: flex;
}

.hub-mini-map__err {
  color: #b91c1c;
  margin: .35rem 0 0;
  font-size: .75rem;
}

.unit-availability {
  border: 1px solid var(--color-border, var(--surface-container-high));
  background: var(--surface-container-lowest);
  border-radius: 1rem;
  margin-bottom: 1.25rem;
  padding: 1.1rem 1.25rem;
}

.unit-availability__title {
  margin: 0 0 .75rem;
  font-size: .875rem;
  font-weight: 700;
}

.unit-availability__grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem 1rem;
  margin-bottom: .9rem;
  display: grid;
}

@media (width <= 640px) {
  .unit-availability__grid {
    grid-template-columns: 1fr;
  }
}

.unit-availability__label {
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--color-text-tertiary, #64748b);
  margin: 0;
  font-size: .65rem;
  font-weight: 700;
}

.unit-availability__value {
  margin: .2rem 0 0;
  font-size: .9rem;
  font-weight: 600;
}

.unit-availability__actions {
  flex-wrap: wrap;
  gap: .5rem;
  display: flex;
}

.unit-listing-form {
  flex-direction: column;
  gap: .75rem;
  max-width: 100%;
  display: flex;
}

.unit-listing-form .folio-field {
  margin: 0;
}

@media (width >= 768px) {
  .unit-listing-form {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: .75rem 1rem;
    max-width: 32rem;
    display: grid;
  }

  .unit-listing-form .folio-form-error {
    grid-column: 1 / -1;
  }
}

@media (width >= 1024px) {
  .unit-listing-form {
    max-width: 40rem;
  }
}

.folio-form-page.maint-hist {
  max-width: 72rem;
}

.maint-hist__place {
  color: var(--on-surface-variant);
  margin: -.25rem 0 1.25rem;
  font-size: .875rem;
}

.maint-hist__place strong {
  color: var(--on-surface);
  font-weight: 600;
}

.maint-hist__grid {
  gap: 1.5rem;
  display: grid;
}

@media (width >= 1024px) {
  .maint-hist__grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    align-items: start;
  }
}

.maint-hist__timeline {
  flex-direction: column;
  display: flex;
}

.maint-hist__row {
  border-top: 1px solid var(--surface-container-high);
  align-items: flex-start;
  gap: .75rem;
  padding: .85rem 1.25rem;
  display: flex;
}

.maint-hist__thumb {
  background: var(--surface-container-high);
  width: 2.75rem;
  height: 2.75rem;
  color: var(--on-surface-variant);
  border-radius: .5rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: flex;
}

.maint-hist__row-body {
  flex: 1;
  min-width: 0;
}

.maint-hist__row-top {
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  display: flex;
}

.maint-hist__row-title {
  color: var(--on-surface);
  font-size: .875rem;
  font-weight: 600;
  text-decoration: none;
}

.maint-hist__row-meta {
  color: var(--on-surface-variant);
  margin: .2rem 0 0;
  font-size: .75rem;
}

.maint-hist__row-aside {
  flex-direction: column;
  align-items: flex-end;
  gap: .35rem;
  display: flex;
}

.maint-hist__amount {
  font-variant-numeric: tabular-nums;
  font-size: .875rem;
  font-weight: 700;
}

.maint-hist__wo-picker {
  border: none;
  flex-direction: column;
  gap: .5rem;
  margin: 0 0 1rem;
  padding: 0;
  display: flex;
}

.maint-hist__wo-opt {
  cursor: pointer;
  border: 1px solid rgba(198, 198, 205, .45);
  border-radius: .75rem;
  align-items: flex-start;
  gap: .75rem;
  padding: .65rem .75rem;
  display: flex;
}

.maint-hist__wo-opt-title {
  font-size: .875rem;
  font-weight: 600;
  display: block;
}

.maint-hist__wo-opt-sub {
  color: var(--on-surface-variant);
  margin-top: .15rem;
  font-size: .7rem;
  display: block;
}

.maint-hist__receipt {
  background: var(--surface-container-low);
  text-align: center;
  color: var(--on-surface-variant);
  border: 1px dashed rgba(198, 198, 205, .7);
  border-radius: 1rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .25rem;
  padding: 1.5rem 1rem;
  display: flex;
}

.maint-hist__receipt-title {
  color: var(--on-surface);
  margin: 0;
  font-size: .875rem;
  font-weight: 600;
}

.maint-hist__receipt-sub {
  margin: 0;
  font-size: .7rem;
}

.hub-activity-rail__thumb {
  background: var(--surface-container-high);
  width: 2.5rem;
  height: 2.5rem;
  color: var(--on-surface-variant);
  border-radius: .5rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: flex;
}

.hub-units-search {
  max-width: 20rem;
  margin: 0 1.25rem .75rem;
  position: relative;
}

.hub-units-search__icon {
  color: var(--on-surface-variant);
  pointer-events: none;
  position: absolute;
  top: 50%;
  left: .75rem;
  transform: translateY(-50%);
  font-size: 18px !important;
}

.hub-units-search .folio-input {
  padding-left: 2.5rem;
}

.hub-activity-rail__footer {
  border-top: 1px solid var(--surface-container-low);
  gap: .5rem;
  padding: .75rem 1.25rem;
  display: flex;
}

.hub-activity-rail__footer .folio-btn {
  flex: 1;
  justify-content: center;
}

.hub-activity-rail__head .hub-activity-rail__hint {
  padding: .25rem 0 0;
}

.assets-kpi-strip {
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: .75rem;
  margin-bottom: 1.25rem;
  display: grid;
}

.assets-kpi {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .25);
  border-radius: .75rem;
  padding: .85rem 1rem;
}

.assets-kpi__label {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--on-surface-variant);
  margin: 0 0 .25rem;
  font-size: .6rem;
  font-weight: 700;
}

.assets-kpi__value {
  font-variant-numeric: tabular-nums;
  letter-spacing: -.03em;
  color: var(--on-surface);
  margin: 0;
  font-size: 1.5rem;
  font-weight: 700;
}

.assets-gallery {
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
  display: grid;
}

.assets-card {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .25);
  border-radius: 1rem;
  flex-direction: column;
  transition: box-shadow .15s, border-color .15s;
  display: flex;
  overflow: visible;
}

@media (hover: hover) and (pointer: fine) {
  .assets-card:hover {
    border-color: rgba(198, 198, 205, .55);
    box-shadow: 0 8px 24px rgba(25, 28, 30, .06);
  }
}

.assets-card__hero {
  color: inherit;
  text-decoration: none;
  display: block;
}

.assets-card__banner {
  background: linear-gradient(135deg, #334155, #0f172a);
  border-radius: 1rem 1rem 0 0;
  align-items: flex-end;
  height: 6.5rem;
  padding: 1rem;
  display: flex;
}

.assets-card__banner--unit {
  background: linear-gradient(135deg, #065f46, #0f172a);
}

.assets-card__body {
  padding: 1rem 1rem .5rem;
}

.assets-card__title {
  letter-spacing: -.02em;
  color: var(--on-surface);
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
}

.assets-card__meta {
  color: var(--on-surface-variant);
  text-transform: capitalize;
  margin: .25rem 0 0;
  font-size: .75rem;
}

.assets-card__pills {
  flex-wrap: wrap;
  gap: .4rem;
  margin-top: .75rem;
  display: flex;
}

.assets-card__actions {
  gap: .5rem;
  padding: 0 1rem 1rem;
  display: flex;
  position: relative;
}

.assets-card__cta {
  flex: 1;
  justify-content: center;
  font-size: .75rem !important;
}

.assets-jump {
  flex: 1;
  position: relative;
}

.assets-unit-menu {
  z-index: 20;
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .4);
  border-radius: .75rem;
  width: min(100vw - 2rem, 280px);
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  overflow: hidden;
  box-shadow: 0 12px 32px rgba(25, 28, 30, .12);
}

.assets-unit-opt {
  color: inherit;
  background: none;
  border: none;
  flex-direction: column;
  gap: .15rem;
  padding: .75rem 1rem;
  text-decoration: none;
  display: flex;
}

@media (hover: hover) and (pointer: fine) {
  .assets-unit-opt:hover {
    background: var(--surface-container-low);
  }
}

.assets-unit-opt__name {
  font-size: .8125rem;
  font-weight: 600;
}

.assets-unit-opt__meta {
  color: var(--on-surface-variant);
  text-transform: capitalize;
  font-size: .7rem;
}

.unit-crumb {
  color: var(--on-surface-variant);
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  margin-bottom: .75rem;
  font-size: .8rem;
  display: flex;
}

.unit-crumb a {
  color: var(--on-surface-variant);
  font-weight: 600;
  text-decoration: none;
}

.unit-crumb a:hover {
  color: var(--on-surface);
}

.unit-actions {
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: 1.25rem;
  display: flex;
}

.unit-actions--stack {
  flex-flow: column;
  align-items: stretch;
}

.unit-history-aside {
  align-self: start;
  position: sticky;
  top: 1rem;
}

.unit-panel {
  flex-direction: column;
  gap: 1rem;
  display: flex;
}

.unit-attention {
  border-radius: .625rem;
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem;
  padding: .75rem 1rem;
  font-size: .875rem;
  display: flex;
}

.unit-attention--late {
  background: var(--error-container);
  color: var(--on-error-container);
  border: 1px solid #f2b8b5;
}

.unit-attention--clear {
  color: #166534;
  background: #dcfce7;
  border: 1px solid #a7f3d0;
}

.unit-pulse {
  grid-template-columns: repeat(2, 1fr);
  gap: .75rem;
  display: grid;
}

@media (width >= 1024px) {
  .unit-pulse {
    grid-template-columns: repeat(4, 1fr);
  }
}

.unit-pulse__cell {
  background: var(--surface-container-lowest);
  border: 1px solid var(--surface-container-high);
  border-radius: .75rem;
  padding: .85rem 1rem;
}

.unit-pulse__cell--stress {
  border-top: 3px solid var(--error);
}

.unit-pulse__num {
  font-variant-numeric: tabular-nums;
  margin: .25rem 0 0;
  font-size: 1.35rem;
  font-weight: 800;
}

.unit-pulse__lbl {
  color: var(--on-surface-variant);
  font-size: .75rem;
  font-weight: 600;
}

.unit-today-grid {
  gap: 1rem;
  display: grid;
}

@media (width >= 1024px) {
  .unit-today-grid {
    grid-template-columns: repeat(12, 1fr);
  }

  .unit-today-grid__issues {
    grid-column: span 7;
  }

  .unit-today-grid__people {
    grid-column: span 5;
  }
}

.unit-quiet-links {
  flex-wrap: wrap;
  gap: .75rem 1.25rem;
  font-size: .8125rem;
  display: flex;
}

.unit-quiet-links button, .unit-quiet-links a {
  font: inherit;
  color: var(--on-surface-variant);
  cursor: pointer;
  text-underline-offset: 2px;
  background: none;
  border: none;
  padding: 0;
  font-weight: 600;
  text-decoration: underline;
}

.unit-pay-table {
  border-collapse: collapse;
  width: 100%;
  font-size: .875rem;
}

.unit-pay-table th, .unit-pay-table td {
  border-bottom: 1px solid var(--surface-container-high);
  text-align: left;
  padding: .55rem .65rem;
}

.unit-pay-table .num {
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.method-chips {
  flex-wrap: wrap;
  gap: .4rem;
  display: flex;
}

.method-chip {
  appearance: none;
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  cursor: pointer;
  border: 1px solid rgba(198, 198, 205, .55);
  border-radius: 999px;
  padding: .35rem .75rem;
  font-size: .75rem;
  font-weight: 600;
  line-height: 1.2;
}

.method-chip.on {
  background: var(--navy);
  border-color: var(--navy);
  color: #fff;
}

.folio-field {
  flex-direction: column;
  gap: .35rem;
  display: flex;
}

.dash-map-peek {
  color: #f1f5f9;
  background: linear-gradient(135deg, #1e293b, #0f172a);
  border-radius: .875rem;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-top: 1.25rem;
  padding: 1rem 1.25rem;
  text-decoration: none;
  display: flex;
}

.dash-map-peek:hover {
  opacity: .95;
}

.dash-map-peek__title {
  margin: 0;
  font-size: .95rem;
  font-weight: 700;
}

.dash-map-peek__sub {
  color: #94a3b8;
  margin: .25rem 0 0;
  font-size: .75rem;
}

.map-layer-chips {
  flex-wrap: wrap;
  gap: .4rem;
  margin-bottom: .75rem;
  display: flex;
}

.map-layer-chip {
  background: var(--surface-container-lowest);
  color: var(--on-surface-variant);
  cursor: pointer;
  border: 1px solid rgba(198, 198, 205, .4);
  border-radius: 999px;
  padding: .35rem .75rem;
  font-size: .7rem;
  font-weight: 700;
}

.map-layer-chip--active {
  background: var(--navy);
  color: #fff;
  border-color: var(--navy);
}

.docs-page__filter-hint {
  margin-bottom: 1rem;
}

.docs-page__group-by {
  margin-bottom: 1.25rem;
}

.docs-page__group-by .folio-segment-bar {
  margin-bottom: 0;
}

.docs-page__list {
  flex-direction: column;
  gap: 0;
  display: flex;
}

.docs-group + .docs-group {
  border-top: 1px solid var(--surface-container-high);
}

.docs-group__head {
  background: var(--surface-container-low);
  z-index: 1;
  justify-content: space-between;
  align-items: baseline;
  gap: .75rem;
  padding: .75rem 1.25rem;
  display: flex;
  position: sticky;
  top: 0;
}

.docs-group__title {
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--on-surface);
  margin: 0;
  font-size: .75rem;
  font-weight: 700;
}

.docs-group__meta {
  color: var(--on-surface-variant);
  margin: 0;
  font-size: .625rem;
}

.team-banner {
  color: var(--on-surface-variant);
  background: rgba(19, 27, 46, .05);
  border: 1px solid rgba(19, 27, 46, .14);
  border-radius: .75rem;
  align-items: center;
  gap: .55rem;
  margin: 0 0 1.25rem;
  padding: .6rem .9rem;
  font-size: .78rem;
  line-height: 1.35;
  display: flex;
}

.team-banner .material-symbols-outlined {
  color: var(--navy);
  flex-shrink: 0;
  font-size: 17px;
}

.team-banner strong {
  color: var(--navy);
  font-weight: 700;
}

.chip-dispatch {
  color: var(--navy);
  background: rgba(19, 27, 46, .08);
  border: 1px solid rgba(19, 27, 46, .18);
  border-radius: 999px;
  padding: .2rem .55rem;
  font-size: .68rem;
  font-weight: 700;
}

.folio-btn.is-disabled, .folio-btn:disabled {
  opacity: .45;
  cursor: not-allowed;
  pointer-events: none;
  box-shadow: none !important;
}

.team-note {
  color: #5f6368;
  align-items: flex-start;
  gap: .5rem;
  font-size: .75rem;
  line-height: 1.45;
  display: flex;
}

.team-note .material-symbols-outlined {
  flex-shrink: 0;
  margin-top: .08rem;
  font-size: 16px;
}

.folio-layout--vm {
  min-height: 100vh;
  display: flex;
}

.vm-nav-column {
  display: none;
}

@media (width >= 768px) {
  .vm-nav-column {
    background: var(--surface-container-lowest);
    border-right: 1px solid rgba(198, 198, 205, .35);
    flex-direction: column;
    flex-shrink: 0;
    width: 16rem;
    display: flex;
  }

  .vm-nav-column .folio-sidebar {
    border: 0;
    flex: 1;
    width: 100%;
    height: auto;
    position: static;
  }
}

.folio-main--vm {
  flex: 1;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  padding: 1.25rem 1rem 4rem;
}

@media (width >= 768px) {
  .folio-main--vm {
    padding: 2rem 2rem 4rem;
  }
}

.vm-eng {
  background: var(--surface-container-low);
  border-radius: 8px;
  margin-top: .55rem;
  padding: .55rem .65rem;
}

.vm-eng .t {
  color: var(--on-surface);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
}

.vm-eng .s {
  color: var(--outline);
  margin-top: 2px;
  font-size: 10px;
}

.vm-page {
  width: 100%;
}

.vm-page--narrow {
  max-width: 40rem;
}

.vm-page-header {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: .75rem;
  margin-bottom: 1.25rem;
  display: flex;
}

.vm-kicker {
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--on-surface-variant);
  margin-bottom: .25rem;
  font-size: 10px;
  font-weight: 700;
}

.vm-title {
  letter-spacing: -.02em;
  color: var(--on-surface);
  text-wrap: balance;
  font-size: 1.7rem;
  font-weight: 800;
  line-height: 2rem;
}

.vm-sub {
  color: var(--on-surface-variant);
  margin-top: .25rem;
  font-size: .875rem;
}

.vm-header-actions {
  flex-wrap: wrap;
  gap: .5rem;
  display: flex;
}

.vm-card {
  background: var(--surface-container-lowest);
  border: 1px solid rgba(198, 198, 205, .4);
  border-radius: 12px;
  margin-bottom: 1.25rem;
  overflow: hidden;
}

.vm-card-head {
  justify-content: space-between;
  align-items: center;
  padding: .85rem 1rem .6rem;
  display: flex;
}

.vm-card-head h2, .vm-section-title {
  margin: 0;
  font-size: .875rem;
  font-weight: 700;
}

.vm-link-quiet {
  color: var(--on-surface-variant);
  font-size: .75rem;
  font-weight: 600;
  text-decoration: none;
}

.vm-link-quiet:hover {
  color: var(--on-surface);
}

.vm-attn-list, .vm-lead-list, .vm-member-list, .vm-rule-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.vm-attn-row, .vm-lead-row, .vm-member-row {
  border-top: 1px solid rgba(198, 198, 205, .35);
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem;
  padding: .85rem 1rem;
  display: flex;
}

.vm-attn-body, .vm-lead-body, .vm-member-body {
  flex: 1;
  min-width: 0;
}

.vm-attn-title {
  color: var(--on-surface);
  font-size: .875rem;
  font-weight: 600;
  text-decoration: none;
}

.vm-attn-meta {
  color: var(--on-surface-variant);
  margin-top: .15rem;
  font-size: .75rem;
}

.vm-lead-title-row {
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  display: flex;
}

.vm-rail-wrap {
  max-width: 28rem;
  margin-top: .75rem;
}

.vm-score-card {
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.vm-score-num {
  margin: 0;
  font-size: 2.25rem;
  font-weight: 800;
  line-height: 1;
}

.vm-score-den {
  color: var(--on-surface-variant);
  margin-left: .15rem;
  font-size: 1rem;
  font-weight: 700;
}

.vm-score-copy {
  flex: 1;
  min-width: 14rem;
}

.vm-score-title-row {
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  display: flex;
}

.vm-band {
  margin-bottom: 1.25rem;
  padding: 1rem 1.25rem;
  text-decoration: none;
  display: block;
}

.vm-band-top {
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .75rem;
  display: flex;
}

.vm-grid-2 {
  gap: 1rem;
  display: grid;
}

@media (width >= 768px) {
  .vm-grid-2 {
    grid-template-columns: 1fr 1fr;
  }
}

.vm-form-card {
  flex-direction: column;
  gap: 1rem;
  padding: 1.25rem;
  display: flex;
}

.vm-form-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .75rem;
  display: flex;
}

.vm-stub-note {
  color: #5f6368;
  background: var(--surface-container-low);
  border-radius: 8px;
  margin: 0;
  padding: .6rem .75rem;
  font-size: .75rem;
}

.vm-site-grid {
  grid-template-columns: 1fr;
  gap: .85rem;
  display: grid;
}

@media (width >= 640px) {
  .vm-site-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (width >= 1024px) {
  .vm-site-grid {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

.vm-site-tile {
  background: var(--surface-container-lowest);
  color: inherit;
  border: 1px solid rgba(198, 198, 205, .45);
  border-radius: 12px;
  padding: 1rem;
  text-decoration: none;
  transition: box-shadow .15s, border-color .15s;
  display: block;
}

.vm-site-tile:hover {
  border-color: var(--outline-variant);
  box-shadow: 0 8px 20px -4px rgba(25, 28, 30, .1);
}

.vm-site-tile-foot {
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  margin-top: .75rem;
  display: flex;
}

.vm-meter-row {
  grid-template-columns: 7rem 1fr 2.5rem;
  align-items: center;
  gap: .5rem;
  margin-top: .65rem;
  font-size: .75rem;
  display: grid;
}

.vm-rule-list li {
  border-bottom: 1px solid rgba(198, 198, 205, .3);
  padding: .55rem 0;
  font-size: .875rem;
}

.vm-rule-on {
  font-weight: 600;
}

.vm-member-score {
  text-align: right;
  min-width: 2.5rem;
}

.chip {
  border: 1px solid var(--outline-variant);
  background: var(--surface-container-lowest);
  color: var(--on-surface-variant);
  border-radius: 999px;
  align-items: center;
  gap: .25rem;
  padding: .2rem .55rem;
  font-size: .68rem;
  font-weight: 700;
  display: inline-flex;
}

.chip-prime {
  background: var(--navy);
  color: #fff;
  border-color: var(--navy);
}

.chip-ref {
  background: var(--surface-container-lowest);
  color: var(--on-surface-variant);
  border-color: var(--outline-variant);
}

.chip-w2 {
  color: var(--navy);
  background: rgba(19, 27, 46, .08);
  border-color: rgba(19, 27, 46, .2);
}

.chip-sub {
  color: #1a5fa8;
  background: rgba(74, 144, 217, .1);
  border-color: rgba(74, 144, 217, .3);
}

.chip-green {
  color: var(--green);
  background: rgba(6, 150, 105, .1);
  border-color: rgba(6, 150, 105, .3);
}

.chip-amber {
  color: var(--warning);
  background: rgba(178, 106, 0, .1);
  border-color: rgba(178, 106, 0, .3);
}

.score {
  font-variant-numeric: tabular-nums;
  letter-spacing: -.01em;
  font-size: 13px;
  font-weight: 800;
}

.score.hi {
  color: var(--green);
}

.score.mid {
  color: var(--warning);
}

.score.lo {
  color: var(--error);
}

.rail {
  align-items: flex-start;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.rail .st {
  flex-direction: column;
  flex: 1;
  align-items: center;
  gap: 5px;
  min-width: 0;
  display: flex;
  position: relative;
}

.rail .st:before {
  content: "";
  background: var(--surface-container-highest);
  height: 1.5px;
  position: absolute;
  top: 5px;
  left: calc(8px - 50%);
  right: calc(50% + 8px);
}

.rail .st:first-child:before {
  display: none;
}

.rail .st.done:before, .rail .st.on:before {
  background: rgba(6, 150, 105, .45);
}

.rail .dot {
  background: var(--surface-container-lowest);
  border: 1.5px solid var(--outline-variant);
  z-index: 1;
  border-radius: 50%;
  flex: none;
  width: 11px;
  height: 11px;
  position: relative;
}

.rail .st.done .dot {
  background: var(--green);
  border-color: var(--green);
}

.rail .st.on .dot {
  background: var(--navy);
  border-color: var(--navy);
  box-shadow: 0 0 0 3px rgba(19, 27, 46, .14);
}

.rail .nm {
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--outline);
  white-space: nowrap;
  font-size: 9px;
  font-weight: 800;
  line-height: 1;
}

.rail .st.done .nm {
  color: var(--green);
}

.rail .st.on .nm {
  color: var(--navy);
}

.band {
  background: linear-gradient(135deg, #0d1420 0%, var(--navy) 55%, #1c2c4e 100%);
  color: #fff;
  border: 0;
  border-radius: 12px;
}

.band-eyebrow {
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .55);
  font-size: .62rem;
  font-weight: 800;
}

.band-total {
  letter-spacing: -.02em;
  margin-top: 3px;
  font-size: 1.9rem;
  font-weight: 800;
  line-height: 1.1;
}

.band-cta {
  color: #fff;
  background: rgba(255, 255, 255, .14);
  border-radius: .45rem;
  align-items: center;
  gap: .35rem;
  padding: .4rem .75rem;
  font-size: .72rem;
  font-weight: 600;
  display: inline-flex;
}

.band-books {
  gap: .85rem;
  margin-top: 1rem;
  display: grid;
}

@media (width >= 640px) {
  .band-books {
    grid-template-columns: 1fr 1fr;
    gap: 0;
  }

  .band-books .bk + .bk {
    border-left: 1px solid rgba(255, 255, 255, .14);
    padding-left: 1.25rem;
  }
}

.bk-label {
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .5);
  align-items: center;
  gap: .4rem;
  font-size: .6rem;
  font-weight: 800;
  display: flex;
}

.bk-label:before {
  content: "";
  border-radius: 50%;
  flex: none;
  width: 6px;
  height: 6px;
}

.bk.prime .bk-label:before {
  background: var(--surface-container-lowest);
}

.bk.ref .bk-label:before {
  border: 1.5px solid rgba(255, 255, 255, .55);
}

.bk-num {
  font-variant-numeric: tabular-nums;
  margin-top: 3px;
  font-size: 1.05rem;
  font-weight: 800;
}

.bk-sub {
  color: rgba(255, 255, 255, .55);
  margin-top: 2px;
  font-size: .7rem;
}

.map-frame {
  background: radial-gradient(at 30% 40%, rgba(19, 27, 46, .06) 0%, rgba(0, 0, 0, 0) 45%), linear-gradient(165deg, #e8eef5 0%, #d5e0ec 50%, #c5d4e4 100%);
  border: 1px solid rgba(198, 198, 205, .35);
  border-radius: 12px;
  height: 280px;
  position: relative;
  overflow: hidden;
}

.map-zone {
  background: rgba(19, 27, 46, .05);
  border: 1.5px dashed rgba(19, 27, 46, .2);
  border-radius: 999px;
  position: absolute;
}

.map-zone .zl {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(19, 27, 46, .55);
  font-size: 9px;
  font-weight: 800;
  position: absolute;
  top: 7px;
  left: 12px;
}

.map-pin {
  z-index: 1;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  display: flex;
  position: absolute;
  transform: translate(-50%, -100%);
}

.map-pin .dot {
  background: var(--navy);
  border: 2px solid #fff;
  border-radius: 50%;
  width: 11px;
  height: 11px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .22);
}

.map-pin .lbl {
  background: var(--surface-container-lowest);
  white-space: nowrap;
  border: 1px solid rgba(198, 198, 205, .5);
  border-radius: 6px;
  padding: 3px 7px;
  font-size: 10px;
  font-weight: 700;
}

.dns-box {
  background: var(--surface-container-low);
  border: 1px solid rgba(198, 198, 205, .5);
  border-radius: 10px;
  padding: 12px 14px;
  font-family: ui-monospace, Menlo, monospace;
  font-size: 12px;
  line-height: 1.7;
}

.dns-box .dim {
  color: var(--outline);
}

.bar {
  background: var(--surface-container-high);
  border-radius: 99px;
  height: 6px;
  overflow: hidden;
}

.bar > i {
  background: var(--navy);
  border-radius: 99px;
  height: 100%;
  display: block;
}

.bar > i.good {
  background: var(--green);
}

.folio-rating-card {
  background: var(--folio-card);
  border: 1px solid var(--folio-border);
  border-radius: .875rem;
  margin: 1.25rem 0;
  padding: 1rem;
}

@media (width >= 768px) {
  .folio-rating-card {
    padding: 1.25rem;
  }
}

.folio-rating-head {
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  margin-bottom: .75rem;
  display: flex;
}

.folio-rating-head h2 {
  color: var(--folio-text);
  margin: 0;
  font-size: .875rem;
  font-weight: 700;
}

.folio-rating-empty {
  color: var(--folio-muted);
  margin: 0;
  font-size: .8125rem;
}

.folio-rating-layout {
  gap: 1.25rem;
  display: grid;
}

@media (width >= 768px) {
  .folio-rating-layout {
    grid-template-columns: 1fr 1fr;
    align-items: start;
  }
}

.folio-rating-foot {
  color: var(--folio-muted);
  margin: .85rem 0 0;
  font-size: .6875rem;
}

.folio-rating-jobs {
  flex-direction: column;
  gap: .75rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.folio-rating-job {
  border: 1px solid var(--folio-border);
  border-radius: .65rem;
  padding: .75rem .85rem;
}

.folio-rating-job-title {
  color: var(--folio-text);
  margin: 0 0 .35rem;
  font-size: .8125rem;
  font-weight: 700;
}

.folio-rating-job-dim {
  color: var(--folio-muted);
  margin: 0;
  font-size: .6875rem;
}

.step-rail {
  flex-direction: column;
  gap: 2px;
  display: flex;
}

.step {
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: 10px;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  display: flex;
}

.step.on {
  background: var(--surface-container-high);
  box-shadow: inset 2.5px 0 0 var(--navy);
}

.step .n {
  border: 1.5px solid var(--outline-variant);
  width: 22px;
  height: 22px;
  color: var(--outline);
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  font-size: 11px;
  font-weight: 700;
  display: flex;
}

.mkt-card {
  color: inherit;
  text-decoration: none;
  display: block;
}

.mkt-card--prime {
  background: linear-gradient(to bottom right, #fff, rgba(104, 219, 169, .04));
  border: 1.5px solid rgba(104, 219, 169, .6);
  border-radius: 12px;
  padding: 1.1rem 1.2rem;
}

.mkt-meridian {
  align-items: baseline;
  gap: .5rem;
  margin: .5rem 0;
  display: flex;
}

.mkt-meridian-label {
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--on-surface-variant);
  font-size: .68rem;
  font-weight: 700;
}

.mkt-meridian-score {
  color: var(--navy);
  font-size: 1.35rem;
  font-weight: 800;
}

.mkt-meridian--empty .mkt-meridian-score {
  color: var(--outline);
  font-size: 1rem;
}

.hidden-sm {
  display: none;
}

@media (width >= 640px) {
  .hidden-sm {
    display: inline-flex;
  }
}

.tnum {
  font-variant-numeric: tabular-nums;
}

.folio-photos-page {
  width: 100%;
  max-width: 80rem;
  margin: 0 auto;
}

.folio-breadcrumb {
  color: var(--on-surface-variant);
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  margin: 0 0 .85rem;
  font-size: .75rem;
  display: flex;
}

.folio-breadcrumb a {
  color: var(--on-surface-variant);
  font-weight: 500;
  text-decoration: none;
}

.folio-breadcrumb a:hover {
  color: var(--on-surface);
  text-decoration: underline;
}

.folio-photos-toolbar {
  flex-wrap: wrap;
  align-items: center;
  gap: .65rem;
  margin: 0 0 1rem;
  display: flex;
}

.folio-photos-echo {
  color: #166534;
  margin: 0;
  font-size: .8125rem;
  font-weight: 600;
}

.folio-photos-filters {
  -webkit-overflow-scrolling: touch;
  flex-wrap: nowrap;
  gap: .35rem;
  margin: 0 0 1rem;
  padding-bottom: 2px;
  display: flex;
  overflow-x: auto;
}

.folio-chip {
  background: var(--surface-container-lowest);
  color: var(--on-surface-variant);
  cursor: pointer;
  border: 1px solid rgba(198, 198, 205, .45);
  border-radius: 999px;
  flex: none;
  padding: .35rem .7rem;
  font-family: inherit;
  font-size: .75rem;
  font-weight: 600;
}

.folio-chip--active {
  background: var(--on-surface);
  color: #fff;
  border-color: var(--on-surface);
}

.folio-photos-grid {
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: 1.5rem;
  display: grid;
}

@media (width >= 768px) {
  .folio-photos-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: .65rem;
  }
}

@media (width >= 1024px) {
  .folio-photos-grid {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: .75rem;
  }

  .folio-photo-tile--cover {
    grid-area: span 2 / span 2;
  }
}

.folio-photo-tile {
  aspect-ratio: 1;
  background: var(--surface-container-lowest);
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
  border: 1px solid rgba(198, 198, 205, .4);
  border-radius: .75rem;
  padding: 0;
  position: relative;
  overflow: hidden;
}

.folio-photo-tile img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.folio-photo-tile__empty {
  background: var(--surface-container-low);
  width: 100%;
  height: 100%;
  min-height: 6rem;
  color: var(--outline);
  justify-content: center;
  align-items: center;
  display: flex;
}

.folio-photo-tile__meta {
  color: #fff;
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(25, 28, 30, .72));
  flex-direction: column;
  align-items: flex-start;
  gap: .25rem;
  padding: .5rem;
  font-size: .7rem;
  font-weight: 600;
  display: flex;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.folio-photo-tile__caption {
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
  display: block;
  overflow: hidden;
}

.photo-confirm-sheet, .photo-detail {
  flex-direction: column;
  gap: 1rem;
  display: flex;
}

.photo-confirm-sheet__preview, .photo-detail__stage {
  background: #1a1c1e;
  border-radius: .5rem;
  overflow: hidden;
}

.photo-confirm-sheet__preview {
  aspect-ratio: 4 / 3;
}

.photo-confirm-sheet__preview img, .photo-detail__stage img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 100%;
  min-height: 12rem;
  display: block;
}

.photo-confirm-sheet__areas {
  flex-direction: column;
  gap: .35rem;
  display: flex;
}

.photo-confirm-sheet__chips {
  flex-wrap: wrap;
  gap: .35rem;
  display: flex;
}

.photo-confirm-sheet__cover {
  align-items: center;
  gap: .5rem;
  font-size: .875rem;
  font-weight: 500;
  display: flex;
}

.photo-confirm-sheet__footer, .photo-detail .photo-confirm-sheet__footer {
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .5rem;
  margin-top: .5rem;
  display: flex;
}

.photo-detail__cover-row {
  align-items: center;
  gap: .5rem;
  display: flex;
}

@media (width >= 1024px) {
  .photo-detail {
    flex-direction: row;
    align-items: stretch;
    min-height: 16rem;
  }

  .photo-detail__stage {
    flex: 1.5;
    min-width: 0;
  }

  .photo-detail__rail {
    flex-direction: column;
    flex: 1;
    gap: .85rem;
    min-width: 0;
    display: flex;
  }
}

.folio-field__input {
  appearance: none;
  box-sizing: border-box;
  background-color: var(--surface-container);
  width: 100%;
  min-height: 2.75rem;
  color: var(--on-surface);
  box-shadow: none;
  border: none;
  border-radius: 12px;
  outline: none;
  padding: .8rem 1rem;
  font-family: inherit;
  font-size: .9rem;
  transition: background-color .18s cubic-bezier(.23, 1, .32, 1), box-shadow .18s cubic-bezier(.23, 1, .32, 1);
}

.folio-field__input:focus {
  background-color: var(--surface-container-lowest);
  outline: none;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(19, 27, 46, .28);
}

.folio-field__input:focus-visible {
  background-color: var(--surface-container-lowest);
  outline: none;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(19, 27, 46, .28);
}

.folio-form-error {
  color: var(--on-error-container);
  margin: .35rem 0 0;
  font-size: .8125rem;
  font-weight: 600;
}

.folio-add-unit-modal {
  max-width: 28rem;
}

@media (width >= 768px) {
  .folio-add-unit-modal {
    max-width: 36rem;
  }
}

.folio-field-grid {
  grid-template-columns: 1fr;
  gap: .75rem;
  display: grid;
}

@media (width >= 768px) {
  .folio-field-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.modal-subtitle {
  color: var(--on-surface-variant);
  margin: .25rem 0 0;
  font-size: .75rem;
  font-weight: 500;
}

.hub-unit-row__meta--tenant {
  color: var(--on-surface);
  font-weight: 600;
}

.hub-unit-row__facts {
  color: var(--outline);
  margin: .15rem 0 0;
  font-size: .7rem;
}

.hub-unit-row__facts:empty {
  display: none;
}

.home-activity {
  margin-top: 1.25rem;
  margin-bottom: 1.5rem;
}

.home-activity .folio-section-card__title {
  text-transform: none;
  letter-spacing: 0;
  font-size: .875rem;
}

.home-activity__all {
  color: var(--outline);
  align-items: center;
  gap: .25rem;
  font-size: .75rem;
  font-weight: 600;
  text-decoration: none;
  display: inline-flex;
}

.home-activity__all:hover {
  color: var(--on-surface);
}

.home-activity__all .material-symbols-outlined {
  font-size: 15px;
}

.home-activity__row {
  color: inherit;
  text-decoration: none;
  display: block;
}

.home-activity__row-inner {
  justify-content: space-between;
  align-items: flex-start;
  gap: .75rem;
  display: flex;
}

.home-activity__copy {
  min-width: 0;
}

.home-activity__title-row {
  flex-wrap: wrap;
  align-items: center;
  gap: .375rem;
  display: flex;
}

.home-activity__title {
  margin: 0;
  font-size: .875rem;
  font-weight: 600;
}

.home-activity__meta {
  color: var(--outline);
  margin: .125rem 0 0;
  font-size: .75rem;
}

.home-activity__when {
  color: var(--outline);
  flex-shrink: 0;
  font-size: .625rem;
  font-weight: 700;
}

.chip-neutral {
  background: var(--surface-container-lowest);
  color: var(--on-surface-variant);
  border-color: var(--outline-variant);
}

.tl {
  padding-left: 1.35rem;
  position: relative;
}

.tl:before {
  content: "";
  background: var(--surface-container-high);
  border-radius: 2px;
  width: 2px;
  position: absolute;
  top: .5rem;
  bottom: .5rem;
  left: .34rem;
}

.tl-item {
  padding-bottom: 1rem;
  position: relative;
}

.tl-item:last-child {
  padding-bottom: 0;
}

.tl-dot {
  background: var(--surface-container-highest);
  border-radius: 50%;
  width: .7rem;
  height: .7rem;
  position: absolute;
  top: .3rem;
  left: -1.35rem;
  box-shadow: 0 0 0 2px #fff;
}

.tl-dot.red {
  background: var(--error);
}

.tl-dot.amber {
  background: var(--warning);
}

.tl-dot.green {
  background: var(--green);
}

.tl-dot.navy {
  background: var(--navy);
}

.job-thread {
  border: 1px solid var(--surface-container-high);
  background: var(--surface-container-lowest);
  border-radius: 12px;
  margin-bottom: 1.25rem;
  overflow: hidden;
}

.job-thread__head {
  border-bottom: 1px solid rgba(198, 198, 205, .2);
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: .5rem;
  padding: .85rem 1.1rem .7rem;
  display: flex;
}

.job-thread__title {
  margin: 0;
  font-size: .875rem;
  font-weight: 700;
}

.job-thread__sub {
  color: var(--on-surface-variant);
  margin: .2rem 0 0;
  font-size: .75rem;
}

.job-thread__hint {
  color: var(--outline);
  max-width: 18rem;
  margin: 0;
  font-size: .72rem;
}

.job-thread__list {
  flex-direction: column;
  gap: .85rem;
  padding: 1rem 1.1rem;
  display: flex;
}

@media (width >= 768px) {
  .job-thread__list {
    padding: 1.1rem 1.35rem;
  }
}

.job-thread__msg {
  min-width: 0;
}

.job-thread__meta {
  color: var(--outline);
  margin: 0 0 .25rem;
  font-size: .65rem;
}

.job-thread__bubble {
  background: var(--surface-container-low);
  white-space: pre-wrap;
  border-radius: 12px;
  max-width: 100%;
  padding: .6rem .85rem;
  font-size: .82rem;
  line-height: 1.45;
  display: inline-block;
}

@media (width >= 768px) {
  .job-thread__bubble {
    max-width: 70%;
  }
}

.job-thread__empty, .job-thread__err {
  color: var(--on-surface-variant);
  margin: 0;
  padding: 1rem 1.1rem;
  font-size: .8rem;
}

.job-thread__err {
  color: #b91c1c;
}

.job-thread__compose {
  border-top: 1px solid rgba(198, 198, 205, .2);
  flex-direction: column;
  gap: .5rem;
  padding: .75rem 1.1rem 1rem;
  display: flex;
}

@media (width >= 768px) {
  .job-thread__compose {
    flex-direction: row;
    align-items: flex-end;
  }

  .job-thread__input {
    flex: 1;
  }
}

.su-layout {
  color: #191c1e;
  background: #fff;
  min-height: 100dvh;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
  display: flex;
}

.su-brand {
  background: #0d1117;
  flex-shrink: 0;
  width: 42%;
  display: none;
  position: relative;
  overflow: hidden;
}

.su-brand:before {
  content: "";
  background: linear-gradient(135deg, rgba(13, 17, 23, .97) 0%, rgba(19, 27, 46, .88) 55%, rgba(6, 150, 105, .1) 100%);
  position: absolute;
  inset: 0;
}

.su-brand-in {
  z-index: 1;
  flex-direction: column;
  height: 100%;
  padding: 2.5rem 2.25rem;
  display: flex;
  position: relative;
}

.su-mark {
  color: #fff;
  align-items: center;
  gap: .6rem;
  text-decoration: none;
  display: inline-flex;
}

.su-mark-ico {
  background: rgba(255, 255, 255, .1);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: .5rem;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  display: flex;
}

.su-eyebrow {
  text-transform: uppercase;
  letter-spacing: .12em;
  color: #68dba9;
  margin-top: auto;
  margin-bottom: .85rem;
  font-size: .62rem;
  font-weight: 700;
}

.su-h {
  letter-spacing: -.04em;
  color: #fff;
  font-size: clamp(1.7rem, 3vw, 2.25rem);
  font-weight: 800;
  line-height: 1.12;
}

.su-h em {
  color: #68dba9;
  font-style: normal;
}

.su-p {
  color: rgba(255, 255, 255, .5);
  max-width: 22rem;
  margin-top: 1rem;
  font-size: .85rem;
  line-height: 1.7;
}

.su-panel {
  background: #fff;
  flex-direction: column;
  flex: 1;
  min-width: 0;
  min-height: 100dvh;
  display: flex;
}

.su-in {
  box-sizing: border-box;
  width: 100%;
  max-width: 34rem;
  margin: 0 auto;
  padding: 1.5rem 1.25rem 2.5rem;
}

.su-chrome {
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: 2rem;
  display: flex;
}

.su-mobile-mark {
  color: #191c1e;
  align-items: center;
  gap: .5rem;
  text-decoration: none;
  display: flex;
}

.su-mobile-mark-ico {
  background: var(--navy, #131b2e);
  border-radius: .5rem;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  display: flex;
}

.su-mobile-name {
  letter-spacing: -.03em;
  font-size: .875rem;
  font-weight: 800;
}

.su-kicker {
  text-transform: uppercase;
  letter-spacing: .14em;
  color: #45464d;
  font-size: 11px;
  font-weight: 700;
}

.su-title {
  letter-spacing: -.03em;
  color: #191c1e;
  margin-top: .5rem;
  font-size: 1.65rem;
  font-weight: 800;
  line-height: 1.2;
}

.su-lead {
  color: #45464d;
  max-width: 28rem;
  margin-top: .5rem;
  margin-bottom: 1.5rem;
  font-size: .875rem;
  line-height: 1.65;
}

.su-back {
  color: #45464d;
  cursor: pointer;
  background: none;
  border: none;
  align-items: center;
  gap: .25rem;
  margin-bottom: 1.5rem;
  padding: 0;
  font-family: inherit;
  font-size: .75rem;
  font-weight: 600;
  text-decoration: none;
  display: inline-flex;
}

.su-back:hover {
  color: #191c1e;
}

.su-paths {
  flex-direction: column;
  gap: .75rem;
  display: flex;
}

button.su-path {
  text-align: left;
  width: 100%;
  font: inherit;
  color: #191c1e;
  cursor: pointer;
  transition: border-color .15s, transform .16s var(--eo, cubic-bezier(.23,1,.32,1)), background .15s;
  background: #fff;
  border: 1.5px solid #c6c6cd;
  border-radius: 12px;
  padding: 1.15rem 1.2rem;
  display: block;
}

button.su-path:active {
  transform: scale(.985);
}

@media (hover: hover) {
  button.su-path:hover {
    border-color: #131b2e;
  }
}

button.su-path-pri {
  background: rgba(19, 27, 46, .03);
  border-color: #131b2e;
}

.su-path h2 {
  letter-spacing: -.02em;
  margin: .75rem 0 0;
  font-size: 1.05rem;
  font-weight: 800;
}

.su-path p {
  color: #45464d;
  margin-top: .4rem;
  font-size: .8rem;
  line-height: 1.55;
}

.su-go {
  color: #131b2e;
  align-items: center;
  gap: .3rem;
  margin-top: 1rem;
  font-size: .78rem;
  font-weight: 700;
  display: inline-flex;
}

.su-field {
  flex-direction: column;
  gap: .45rem;
  margin-top: .25rem;
  display: flex;
}

.su-field label {
  text-transform: uppercase;
  letter-spacing: .1em;
  color: #45464d;
  font-size: .68rem;
  font-weight: 700;
}

.su-field input {
  box-sizing: border-box;
  color: #191c1e;
  background: #fff;
  border: 1.5px solid #c6c6cd;
  border-radius: .5rem;
  width: 100%;
  padding: .8rem 1rem;
  font-family: inherit;
  font-size: .9rem;
}

.su-field input:focus {
  border-color: #131b2e;
  outline: none;
}

.su-continue {
  justify-content: center;
  width: 100%;
  min-height: 2.75rem;
  margin-top: 1rem;
}

.su-legal {
  color: #45464d;
  margin-top: 2rem;
  font-size: .75rem;
  line-height: 1.6;
}

.su-legal a {
  color: #191c1e;
  text-underline-offset: 2px;
  font-weight: 600;
  text-decoration: underline;
}

.su-err {
  color: #ba1a1a;
  margin: 0;
  font-size: .8rem;
}

.su-check {
  text-align: center;
}

.su-circle {
  color: #069669;
  background: rgba(6, 150, 105, .12);
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 72px;
  height: 72px;
  margin: 2rem auto 1.25rem;
  display: flex;
}

.su-email {
  word-break: break-all;
  color: #191c1e;
  margin-top: .25rem;
  font-weight: 700;
}

.su-cd {
  text-align: left;
  margin-top: 1.25rem;
}

.su-cd-hdr {
  color: #45464d;
  justify-content: space-between;
  font-size: .75rem;
  display: flex;
}

.su-cd-track {
  background: #e8e8ed;
  border-radius: 99px;
  height: 4px;
  margin-top: .4rem;
  overflow: hidden;
}

.su-cd-fill {
  background: #069669;
  width: 100%;
  height: 100%;
}

.su-check-actions {
  flex-direction: column;
  align-items: center;
  gap: .75rem;
  margin-top: 2rem;
  display: flex;
}

.su-text-btn {
  font: inherit;
  color: #191c1e;
  cursor: pointer;
  text-underline-offset: 2px;
  background: none;
  border: none;
  padding: 0;
  font-size: .8rem;
  font-weight: 600;
  text-decoration: underline;
}

.su-resend {
  font: inherit;
  color: #45464d;
  cursor: pointer;
  background: none;
  border: 1.5px solid #c6c6cd;
  border-radius: .5rem;
  align-items: center;
  gap: .35rem;
  padding: .45rem .75rem;
  font-size: .8rem;
  font-weight: 600;
  display: inline-flex;
}

.su-resend:disabled {
  opacity: .55;
  cursor: default;
}

@media (width >= 960px) {
  .su-brand {
    display: flex;
  }

  .su-in {
    max-width: 36rem;
    padding: 3rem 2.5rem 3.5rem;
  }

  .su-mobile-mark {
    display: none;
  }

  .su-title {
    font-size: 1.85rem;
  }

  .su-chrome {
    margin-bottom: 2.5rem;
  }
}

@media (width >= 640px) {
  .sm\:block {
    display: block;
  }
}

@media (width >= 768px) {
  .md\:block {
    display: block;
  }

  .md\:hidden {
    display: none;
  }
}

@media (width >= 1024px) {
  .lg\:col-span-2 {
    grid-column: span 2 / span 2;
  }

  .lg\:grid {
    display: grid;
  }

  .lg\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lg\:gap-6 {
    gap: 1.5rem;
  }
}