body.ra-modern {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

body.ra-modern .content-wrapper {
  padding-top: 0.9rem;
  flex: 1;
}

body.ra-modern .content-wrapper > .container {
  width: min(1240px, calc(100% - 1.2rem));
  margin: 0 auto;
  padding: clamp(1rem, 2vw, 1.35rem) 0 clamp(1rem, 2.2vw, 1.6rem);
}

body.ra-modern .site-footer {
  width: min(1240px, calc(100% - 1.2rem));
  margin-left: auto;
  margin-right: auto;
}

body.ra-modern .site-footer__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

body.ra-modern .site-footer__logo-frame {
  margin-left: auto;
  margin-right: auto;
}

body.ra-modern .site-footer__logo {
  margin: 0;
}

.dash-panelbar {
  position: -webkit-sticky;
  position: sticky;
  top: calc(var(--site-header-offset, 132px) + 2px);
  z-index: 1100;
}

.dash-panelbar__inner {
  width: min(1240px, calc(100% - 1.2rem));
  margin: 0 auto;
  border-radius: 16px;
  border: 1px solid rgba(16, 38, 70, 0.14);
  background:
    radial-gradient(circle at 0% 0%, rgba(31, 92, 168, 0.1), transparent 34%),
    rgba(255, 255, 255, 0.92);
  box-shadow: 0 14px 24px rgba(10, 29, 54, 0.11);
  backdrop-filter: blur(4px);
  padding: 0.5rem 0.65rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.dash-panelnav {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.32rem;
}

.dash-panelnav a,
.dash-panel-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #294a77;
  border-radius: 999px;
  border: 1px solid transparent;
  background: transparent;
  padding: 0.45rem 0.72rem;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1;
  font-family: inherit;
  cursor: pointer;
  transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.dash-panelnav a:hover,
.dash-panel-link:hover {
  background: #f3f8ff;
  border-color: #d8e4f5;
}

.dash-panelnav a.is-active {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(100deg, var(--bar-left-color, #1f5ca8), var(--bar-right-color, #27afc9));
}

.dash-panel-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.dash-panel-logout-form {
  margin: 0;
  display: inline-flex;
}

.dash-wallet-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.36rem;
  border-radius: 999px;
  border: 1px solid rgba(16, 66, 122, 0.18);
  background: linear-gradient(120deg, rgba(31, 92, 168, 0.12), rgba(39, 175, 201, 0.14));
  color: #173b6a;
  padding: 0.38rem 0.62rem;
  line-height: 1;
}

.dash-wallet-pill span {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  opacity: 0.9;
}

.dash-wallet-pill strong {
  font-size: 0.9rem;
  font-weight: 800;
}

.dash-panel-link.is-logout {
  color: #7a2f3d;
  border-color: rgba(160, 56, 76, 0.15);
  background: #fff6f7;
}

.dash-messages {
  display: grid;
  gap: 0.5rem;
  margin-bottom: 0.9rem;
}

.dash-alert {
  border-radius: 12px;
  border: 1px solid #d7e1ef;
  background: #f8fbff;
  color: #334e72;
  padding: 0.62rem 0.72rem;
  font-size: 0.88rem;
  font-weight: 600;
}

.dash-alert--success {
  border-color: rgba(27, 138, 98, 0.25);
  background: rgba(35, 167, 118, 0.09);
  color: #1d7556;
}

.dash-alert--error,
.dash-alert--danger {
  border-color: rgba(170, 53, 78, 0.25);
  background: rgba(207, 74, 99, 0.09);
  color: #7f2a3f;
}

.dash-alert--warning {
  border-color: rgba(170, 119, 32, 0.24);
  background: rgba(245, 170, 52, 0.12);
  color: #7e5518;
}

.dash-stack {
  display: grid;
  gap: 1rem;
}

.dash-shell {
  border-radius: 24px;
  border: 1px solid rgba(16, 38, 70, 0.13);
  background:
    radial-gradient(circle at 0% 0%, rgba(31, 92, 168, 0.09), transparent 34%),
    radial-gradient(circle at 100% 100%, rgba(242, 107, 29, 0.08), transparent 28%),
    rgba(255, 255, 255, 0.94);
  box-shadow: 0 18px 38px rgba(10, 27, 50, 0.14);
  backdrop-filter: blur(4px);
}

.dash-kicker {
  margin: 0;
  font-size: 0.74rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  font-weight: 800;
  color: #526986;
}

.dash-title {
  margin: 0.35rem 0 0;
  font-family: var(--ra-body-font, "Manrope"), "Segoe UI", sans-serif;
  font-size: clamp(1.4rem, 2.5vw, 2.15rem);
  line-height: 1.12;
  color: #103159;
}

.dash-lead {
  margin: 0.72rem 0 0;
  color: #566a86;
  max-width: 820px;
  line-height: 1.6;
}

.dash-page-head {
  padding: clamp(1rem, 2vw, 1.35rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.95rem;
}

.dash-head-actions {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.dash-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  border-radius: 10px;
  border: 1px solid transparent;
  text-decoration: none;
  font-size: 0.86rem;
  font-weight: 700;
  padding: 0.58rem 0.78rem;
  cursor: pointer;
}

.dash-btn--primary {
  color: var(--bar-text-color, #fff);
  background: linear-gradient(100deg, var(--bar-left-color, #1f5ca8), var(--bar-right-color, #27afc9));
  border-color: var(--button-border-color, #1f5ca8);
}

.dash-btn--primary:hover,
.dash-btn--primary:focus-visible {
  color: var(--bar-text-color, #fff);
  border-color: var(--hover-color, #f26b1d);
}

.dash-btn--ghost {
  color: var(--bar-left-color, #2e4f79);
  background: #f6f9ff;
  border-color: var(--button-border-color, #d8e2f0);
}

.dash-btn--ghost:hover,
.dash-btn--ghost:focus-visible {
  color: var(--body-text-color, #1a2231);
  border-color: var(--hover-color, #f26b1d);
}

.dash-btn--danger {
  color: #fff;
  background: linear-gradient(100deg, #a33450, #cb4a66);
  border-color: rgba(100, 24, 38, 0.35);
}

.dash-btn--danger:hover,
.dash-btn--danger:focus-visible {
  color: #fff;
}

.dash-btn--wallet {
  color: #fff;
  background: linear-gradient(105deg, #f26b1d, #ff9554);
  border-color: rgba(122, 53, 13, 0.34);
  box-shadow: 0 10px 20px rgba(242, 107, 29, 0.28);
}

.dash-btn--wallet:hover,
.dash-btn--wallet:focus-visible {
  color: #fff;
  border-color: rgba(122, 53, 13, 0.5);
  box-shadow: 0 14px 24px rgba(242, 107, 29, 0.34);
}

.dash-wallet-mini {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 22px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.65);
  background: rgba(255, 255, 255, 0.18);
  padding: 0 8px;
}

.dash-wallet-mini strong {
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1;
  color: #fff;
}

.dash-wallet-pack-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.75rem;
}

.dash-wallet-pack-card {
  border: 1px solid #d5e4f2;
  border-radius: 14px;
  background: linear-gradient(180deg, #ffffff, #f8fbff);
  box-shadow: 0 10px 20px rgba(15, 47, 90, 0.08);
  padding: 0.82rem;
  display: grid;
  gap: 0.42rem;
}

.dash-wallet-pack-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem;
}

.dash-wallet-pack-card__head h3 {
  margin: 0;
  font-size: 0.98rem;
  color: #183b66;
}

.dash-wallet-pack-card__head span {
  font-size: 0.8rem;
  color: #5f7897;
  font-weight: 700;
}

.dash-wallet-pack-card__price {
  margin: 0;
  font-size: 1.22rem;
  line-height: 1.1;
  font-weight: 800;
  color: #0f4c86;
}

.dash-home {
  display: grid;
  gap: 1rem;
}

.dash-home-hero {
  padding: clamp(1rem, 2vw, 1.35rem);
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) 220px;
  align-items: center;
}

.dash-home-hero .dash-kicker,
.dash-home-hero .dash-title {
  color: var(--bar-left-color, #103159);
}

.dash-home-actions {
  margin-top: 0.95rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.dash-home-highlight {
  border-radius: 16px;
  border: 1px solid var(--button-border-color, #1f5ca8);
  background: linear-gradient(135deg, var(--bar-left-color, #1f5ca8), var(--bar-right-color, #27afc9));
  color: var(--bar-text-color, #fff);
  padding: 0.9rem;
  text-align: center;
}

.dash-home-highlight p {
  margin: 0;
  font-size: 0.77rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.9;
}

.dash-home-highlight strong {
  display: block;
  margin-top: 0.3rem;
  font-size: clamp(1.6rem, 4vw, 2.2rem);
  line-height: 1;
}

.dash-home-highlight span {
  display: block;
  margin-top: 0.28rem;
  font-size: 0.86rem;
  opacity: 0.95;
}

.dash-home-stats {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.dash-stat-card {
  border-radius: 14px;
  border: 1px solid var(--button-border-color, #d6e0ef);
  background: #ffffff;
  box-shadow: 0 10px 22px rgba(12, 29, 52, 0.08);
  padding: 0.76rem 0.78rem;
}

.dash-stat-card p {
  margin: 0;
  color: var(--bar-left-color, #5f738f);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.dash-stat-card strong {
  display: block;
  margin-top: 0.2rem;
  color: var(--bar-left-color, #173b6a);
  font-size: 1.45rem;
  line-height: 1.1;
}

.dash-home-modules {
  padding: 1rem;
  display: grid;
  gap: 0.75rem;
}

.dash-module-card {
  border-radius: 14px;
  border: 1px solid var(--button-border-color, #d6e0ef);
  background: #fff;
  padding: 0.82rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.dash-module-card h2 {
  margin: 0;
  color: var(--bar-left-color, #173b6a);
  font-size: 1.02rem;
}

.dash-module-card p {
  margin: 0.25rem 0 0;
  color: #5e728d;
  font-size: 0.9rem;
}

.dash-home-sections {
  padding: 1rem;
}

.dash-section-head h2 {
  margin: 0;
  color: var(--bar-left-color, #173b6a);
  font-family: var(--ra-body-font, "Manrope"), "Segoe UI", sans-serif;
  font-size: clamp(1.2rem, 2.3vw, 1.65rem);
}

.dash-section-head p {
  margin: 0.36rem 0 0;
  color: #5e728d;
  font-size: 0.92rem;
}

.dash-sections-grid {
  margin-top: 0.8rem;
  display: grid;
  gap: 0.55rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dash-section-chip {
  border-radius: 12px;
  border: 1px solid var(--button-border-color, #d8e2f0);
  background: #f8fbff;
  padding: 0.7rem;
  text-decoration: none;
  display: grid;
  gap: 0.12rem;
  color: var(--bar-left-color, #1f3e66);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.dash-section-chip:hover {
  transform: translateY(-2px);
  border-color: var(--hover-color, #f26b1d);
  box-shadow: 0 10px 18px rgba(13, 41, 78, 0.12);
  color: var(--body-text-color, var(--bar-left-color, #1f3e66));
}

.dash-section-chip:hover strong,
.dash-section-chip:hover i {
  color: var(--body-text-color, var(--bar-left-color, #1f3e66));
}

.dash-section-chip__label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--bar-left-color, #5f7390);
  font-weight: 700;
}

.dash-section-chip strong {
  font-size: 1rem;
}

.dash-section-chip i {
  justify-self: end;
  font-size: 0.95rem;
  opacity: 0.72;
}

.dash-empty-note {
  margin: 0.7rem 0 0;
  color: #5e728d;
}

.dash-cats-grid {
  display: grid;
  gap: 0.8rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dash-cat-card {
  border-radius: 18px;
  border: 1px solid #d6e0ef;
  background: #fff;
  box-shadow: 0 10px 22px rgba(12, 29, 52, 0.08);
  padding: 0.95rem;
  text-decoration: none;
  color: #173b6a;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.dash-cat-card:hover {
  transform: translateY(-4px);
  border-color: rgba(31, 92, 168, 0.34);
  box-shadow: 0 18px 28px rgba(12, 34, 68, 0.13);
}

.dash-cat-card__kicker {
  display: block;
  color: #5d7190;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.72rem;
  font-weight: 700;
}

.dash-cat-card h2 {
  margin: 0.3rem 0 0;
  font-size: 1.05rem;
}

.dash-cat-card p {
  margin: 0.4rem 0 0;
  color: #0f3f7d;
  font-size: 2.1rem;
  font-weight: 800;
  line-height: 1;
}

.dash-cat-card small {
  color: #617690;
}

.dash-table-shell {
  padding: 0.5rem;
}

.dash-card-shell {
  padding: 0.85rem;
}

.dash-property-grid {
  display: grid;
  gap: 0.9rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dash-property-card {
  display: grid;
  grid-template-rows: 42% 1fr;
  min-height: 520px;
  aspect-ratio: 1 / 1;
  border-radius: 18px;
  border: 1px solid #d4e0f0;
  background: #fff;
  box-shadow: 0 14px 26px rgba(14, 32, 58, 0.11);
  overflow: hidden;
}

.dash-property-card__media {
  position: relative;
  display: block;
  background: linear-gradient(135deg, #dfe9f8, #eef5ff);
}

.dash-property-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.dash-property-card__img.is-empty {
  opacity: 0.56;
  object-fit: contain;
  padding: 1.2rem;
}

.dash-property-card__kind {
  position: absolute;
  top: 10px;
  left: 10px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.4);
  background: rgba(16, 49, 89, 0.8);
  color: #fff;
  padding: 0.3rem 0.52rem;
  font-size: 0.72rem;
  font-weight: 700;
}

.dash-property-card__body {
  padding: 0.78rem;
  display: grid;
  align-content: start;
  gap: 0.58rem;
  overflow: auto;
}

.dash-property-card__title {
  margin: 0;
  color: #173b6a;
  font-size: 1.04rem;
  line-height: 1.22;
}

.dash-property-card__meta {
  margin: 0.18rem 0 0;
  color: #5f7390;
  font-size: 0.82rem;
}

.dash-property-card__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.dash-property-card__coverage {
  color: #1d416b;
  font-size: 0.82rem;
  font-weight: 700;
}

.dash-property-card__metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 0.38rem;
}

.dash-property-metric {
  border-radius: 999px;
  border: 1px solid #d7e4f2;
  background: #f6f9ff;
  color: #38567f;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.25rem 0.48rem;
}

.dash-portal-checklist {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.32rem;
}

.dash-portal-checklist__item {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.42rem;
  border-radius: 10px;
  border: 1px solid #dbe7f5;
  background: #f8fbff;
  padding: 0.28rem 0.42rem;
}

.dash-portal-checklist__item i {
  font-size: 0.86rem;
}

.dash-portal-checklist__item span {
  color: #244972;
  font-size: 0.78rem;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dash-portal-checklist__item small {
  color: #5f7390;
  font-size: 0.71rem;
  font-weight: 700;
}

.dash-portal-checklist__item.is-uploaded {
  border-color: rgba(46, 176, 124, 0.35);
  background: rgba(46, 176, 124, 0.1);
}

.dash-portal-checklist__item.is-uploaded i {
  color: #1f7b53;
}

.dash-portal-checklist__item.is-inprogress {
  border-color: rgba(37, 115, 190, 0.28);
  background: rgba(37, 115, 190, 0.09);
}

.dash-portal-checklist__item.is-inprogress i {
  color: #1b5e99;
}

.dash-portal-checklist__item.is-failed {
  border-color: rgba(183, 77, 51, 0.33);
  background: rgba(183, 77, 51, 0.1);
}

.dash-portal-checklist__item.is-failed i {
  color: #a04228;
}

.dash-portal-checklist__item.is-missing {
  border-color: #d5dfea;
  background: #f6f8fc;
}

.dash-portal-checklist__item.is-missing i {
  color: #7d90aa;
}

.dash-table-wrap {
  overflow-x: auto;
}

.dash-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  min-width: 980px;
}

.dash-table th,
.dash-table td {
  padding: 0.72rem 0.65rem;
  border-bottom: 1px solid #deE7f3;
  vertical-align: middle;
}

.dash-table th {
  font-size: 0.76rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #617690;
}

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

.dash-table tr.is-muted td {
  opacity: 0.62;
}

.dash-photo-cell {
  width: 92px;
}

.dash-thumb {
  width: 76px;
  height: 62px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid #cfdbec;
  background: #f7faff;
}

.dash-thumb.is-empty {
  filter: grayscale(100%);
  opacity: 0.52;
}

.dash-thumb--lg {
  width: 160px;
  height: 130px;
}

.dash-row-title {
  margin: 0;
  color: #173b6a;
  font-weight: 700;
}

.dash-row-meta {
  margin: 0.16rem 0 0;
  color: #5f7390;
  font-size: 0.82rem;
}

.dash-price {
  color: #0f3f7d;
  font-size: 0.98rem;
}

.dash-status {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 700;
  padding: 0.26rem 0.54rem;
  border: 1px solid transparent;
}

.dash-status.is-active {
  color: #1f5e3f;
  background: rgba(46, 176, 124, 0.12);
  border-color: rgba(46, 176, 124, 0.3);
}

.dash-status.is-paused {
  color: #7a4c16;
  background: rgba(242, 176, 79, 0.13);
  border-color: rgba(242, 176, 79, 0.34);
}

.dash-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
}

.dash-actions form {
  margin: 0;
}

.dash-request-flow {
  display: grid;
  gap: 0.35rem;
  border-radius: 10px;
  border: 1px solid #dbe6f3;
  background: #f8fbff;
  padding: 0.58rem 0.62rem;
  max-width: 360px;
}

.dash-request-flow__title {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #4a6588;
}

.dash-request-flow__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.24rem;
}

.dash-request-flow__list li {
  position: relative;
  padding-left: 1rem;
  font-size: 0.78rem;
  color: #587191;
}

.dash-request-flow__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.38rem;
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 999px;
  background: #ccd9ea;
}

.dash-request-flow__list li.is-done {
  color: #1f6647;
  font-weight: 600;
}

.dash-request-flow__list li.is-done::before {
  background: #21a872;
}

.dash-request-flow__list li.is-current {
  color: #0f4f84;
  font-weight: 700;
}

.dash-request-flow__list li.is-current::before {
  background: #2584c9;
}

.dash-request-flow__list li.is-error {
  color: #8b2f45;
  font-weight: 700;
}

.dash-request-flow__list li.is-error::before {
  background: #cf4a66;
}

.dash-request-flow__list li.is-pending {
  color: #7a8ea7;
}

.dash-request-flow__error {
  margin: 0.1rem 0 0;
  font-size: 0.74rem;
  color: #7f2b40;
}

.dash-mini-btn {
  appearance: none;
  font-family: inherit;
  border-radius: 9px;
  border: 1px solid transparent;
  text-decoration: none;
  font-size: 0.76rem;
  font-weight: 700;
  line-height: 1;
  padding: 0.45rem 0.58rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #21446f;
  background: #f7faff;
  border-color: #d6e1f1;
}

.dash-mini-btn--warn {
  color: #6d4a14;
  background: #fff7e9;
  border-color: #f0d6a4;
}

.dash-mini-btn--danger {
  color: #8d2a43;
  background: #fff3f6;
  border-color: #efc2cf;
}

.dash-mini-btn--ok {
  color: #1f6548;
  background: #eefaf4;
  border-color: #bce5d1;
}

.dash-mini-btn--dark {
  color: #fff;
  background: #2d3e5e;
  border-color: rgba(20, 26, 38, 0.35);
}

.dash-mini-btn--info {
  color: #0f4678;
  background: #eef6ff;
  border-color: #bdd4ef;
}

.dash-mini-btn--favorite {
  color: #6b560d;
  background: #fff8e8;
  border-color: #f0d9a1;
}

.dash-mini-btn--favorite-on {
  color: #fff;
  background: linear-gradient(120deg, #f2b223, #f08a12);
  border-color: rgba(153, 93, 17, 0.55);
}

.dash-mini-btn--ghost {
  color: #3f5b7f;
  background: #f8fbff;
  border-color: #d6e2f1;
}

.dash-featured-badge {
  margin-top: 0.25rem;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  border-radius: 999px;
  border: 1px solid #f0d9a1;
  background: #fff8e8;
  color: #6b560d;
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1;
  padding: 0.22rem 0.46rem;
}

.dash-watermark-branding {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) 230px;
  gap: 0.9rem;
  align-items: start;
}

.dash-watermark-branding__main {
  display: grid;
  gap: 0.7rem;
}

.dash-watermark-branding__preview {
  border: 1px solid #d7e3f3;
  border-radius: 12px;
  background: #f8fbff;
  min-height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.65rem;
}

.dash-watermark-branding__preview img {
  max-width: 100%;
  max-height: 200px;
  object-fit: contain;
}

.dash-watermark-sidebar {
  border: 1px solid #d7e3f3;
  border-radius: 12px;
  background: #f8fbff;
  padding: 0.7rem;
}

.dash-watermark-opacity-form {
  display: grid;
  gap: 0.45rem;
}

.dash-watermark-opacity-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem;
  color: #385377;
  font-weight: 700;
  font-size: 0.86rem;
}

.dash-watermark-opacity-range {
  width: 100%;
  accent-color: #20a8c0;
}

.dash-watermark-opacity-actions {
  justify-content: flex-end;
}

.dash-watermark-opacity-actions .dash-mini-btn {
  width: 100%;
  justify-content: center;
}

.dash-watermark-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.dash-watermark-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.8rem;
}

.dash-watermark-card {
  border: 1px solid #d9e5f4;
  border-radius: 14px;
  background: #fbfdff;
  padding: 0.7rem;
  box-shadow: 0 10px 20px rgba(12, 31, 54, 0.07);
}

.dash-watermark-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem;
  margin-bottom: 0.55rem;
}

.dash-watermark-compare {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem;
}

.dash-watermark-compare figure {
  margin: 0;
  border: 1px solid #dce7f5;
  border-radius: 10px;
  overflow: hidden;
  background: #ffffff;
}

.dash-watermark-compare figcaption {
  margin: 0;
  padding: 0.35rem 0.45rem;
  font-size: 0.72rem;
  font-weight: 700;
  color: #486485;
  border-bottom: 1px solid #e4ecf8;
  background: #f5f9ff;
}

.dash-watermark-compare img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  display: block;
}

.dash-watermark-empty {
  min-height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #6d84a2;
  font-size: 0.83rem;
}

.dash-watermark-card__actions {
  margin-top: 0.55rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.dash-watermark-error {
  margin: 0.45rem 0 0;
  font-size: 0.78rem;
  color: #8a2e44;
}

.dash-ai-flow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.62rem;
}

.dash-ai-step {
  border: 1px solid #d6e5f2;
  border-radius: 14px;
  background: linear-gradient(145deg, #fafdff, #f4fbff);
  padding: 0.72rem 0.78rem;
  box-shadow: 0 10px 24px rgba(20, 50, 82, 0.05);
}

.dash-ai-step p {
  margin: 0;
  color: #4c7090;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.dash-ai-step strong {
  display: block;
  margin-top: 0.22rem;
  color: #143b64;
  font-size: 1rem;
  line-height: 1.2;
}

.dash-ai-step span {
  display: block;
  margin-top: 0.2rem;
  color: #5f7895;
  font-size: 0.83rem;
}

.dash-ai-cost-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.55rem;
  margin-bottom: 0.72rem;
}

.dash-ai-cost-card {
  border: 1px solid #d9e4f3;
  border-radius: 12px;
  background: #fbfdff;
  padding: 0.62rem 0.66rem;
}

.dash-ai-cost-card p {
  margin: 0;
  color: #5c7290;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.dash-ai-cost-card strong {
  display: block;
  margin-top: 0.24rem;
  color: #173a64;
  font-size: 1rem;
  line-height: 1.1;
}

.dash-ai-toolbar {
  margin-top: 0.18rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.42rem;
}

.dash-ai-toolbar-group {
  border: 1px solid #d8e6f3;
  border-radius: 11px;
  background: #f8fcff;
  padding: 0.42rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.36rem;
  align-items: center;
}

.dash-ai-toolbar-label {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.48rem;
  border-radius: 999px;
  background: #e5f1fb;
  color: #35597a;
  font-size: 0.69rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.dash-ai-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem;
  margin-bottom: 0.14rem;
}

.dai-page {
  width: min(1180px, 100%);
  margin-inline: auto;
}

.dai-page .dash-shell,
.dai-page .dash-home-stats {
  width: min(1140px, 100%);
  margin-inline: auto;
}

.dai-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dai-metrics .dash-stat-card strong {
  font-size: clamp(1rem, 1.6vw, 1.38rem);
  overflow-wrap: anywhere;
}

.dai-layout-shell {
  position: relative;
  overflow: hidden;
  padding: clamp(0.95rem, 2vw, 1.22rem);
}

.dai-layout-shell::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 0% 0%, rgba(39, 145, 198, 0.12), transparent 36%),
    radial-gradient(circle at 100% 100%, rgba(242, 107, 29, 0.08), transparent 36%);
  pointer-events: none;
}

.dai-layout {
  position: relative;
  z-index: 1;
  max-width: 1100px;
  margin: 0 auto;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(290px, 380px) minmax(0, 1fr);
  gap: clamp(0.72rem, 1.8vw, 1.05rem);
  align-items: start;
}

.dai-panel {
  min-width: 0;
  border: 1px solid #d6e3f2;
  border-radius: 18px;
  background: linear-gradient(155deg, #fafdff, #f4faff);
  padding: clamp(0.82rem, 1.8vw, 1rem);
  box-shadow: 0 15px 30px rgba(14, 38, 66, 0.11);
}

.dai-panel--result {
  background: linear-gradient(160deg, #fbfeff, #f6fbff);
}

.dai-panel__head h2 {
  margin: 0;
  color: #123b66;
  font-size: clamp(1.08rem, 1.7vw, 1.22rem);
}

.dai-panel__head p {
  margin: 0.26rem 0 0;
  color: #5b7694;
  font-size: 0.84rem;
}

.dai-panel__head--actions {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.dai-panel__head--actions .dash-btn {
  flex-shrink: 0;
}

.dai-generate-controls {
  display: grid;
  gap: 0.5rem;
  min-width: 260px;
}

.dai-personality {
  border: 1px solid #d7e5f3;
  border-radius: 12px;
  background: #fff;
  padding: 0.45rem 0.5rem;
  display: grid;
  gap: 0.25rem;
}

.dai-personality label {
  margin: 0;
  color: #22496f;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.dai-personality select {
  width: 100%;
  border-radius: 9px;
  border: 1px solid #c9daed;
  background: #f9fcff;
  color: #1f466c;
  font-size: 0.82rem;
  font-weight: 600;
  min-height: 2.2rem;
}

.dai-personality .dash-row-meta {
  margin: 0;
  font-size: 0.76rem;
}

.dai-preview {
  margin: 0.82rem 0;
  border: 1px solid #d8e5f3;
  border-radius: 14px;
  overflow: hidden;
  background: #edf4fc;
}

.dai-preview img {
  width: 100%;
  height: 238px;
  display: block;
  object-fit: cover;
}

.dai-property-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.42rem;
}

.dai-property-list li {
  border: 1px solid #dce7f4;
  border-radius: 11px;
  background: #fff;
  padding: 0.46rem 0.54rem;
  font-size: 0.82rem;
  line-height: 1.35;
  color: #38577d;
  overflow-wrap: anywhere;
}

.dai-property-list strong {
  color: #173c64;
}

.dai-description-card {
  margin-top: 0.78rem;
  border: 1px solid #d5e3f2;
  border-radius: 16px;
  background: #fff;
  padding: clamp(0.72rem, 1.5vw, 0.92rem);
}

.dai-empty-state {
  min-height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-radius: 13px;
  border: 1px dashed #c6d9ee;
  background: #f7fbff;
  color: #5f7b98;
  font-weight: 600;
  font-size: 0.92rem;
  padding: 0.9rem;
}

.dai-description-text {
  margin: 0.5rem 0 0;
  border: 1px solid #dce8f4;
  border-radius: 12px;
  background: #fafdff;
  padding: 0.8rem;
  color: #2c4b71;
  font-size: clamp(1rem, 1.15vw, 1.18rem);
  line-height: 1.72;
  letter-spacing: 0.005em;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  max-height: 430px;
  overflow: auto;
  font-family: "Inter", "Segoe UI", sans-serif;
}

.dai-actions {
  margin-top: 0.62rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.dai-apply-status {
  margin: 0.52rem 0 0;
  border-radius: 10px;
  border: 1px solid #bce5d1;
  background: #eefaf4;
  color: #1f6548;
  padding: 0.45rem 0.6rem;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.3;
  opacity: 0;
  transform: translateY(-3px);
  transition: opacity 0.18s ease, transform 0.18s ease;
}

.dai-apply-status.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.dai-apply-status.is-error {
  border-color: #efc2cf;
  background: #fff3f6;
  color: #8d2a43;
}

.dai-apply-status.is-pending {
  border-color: #bdd4ef;
  background: #eef6ff;
  color: #0f4678;
}

.dai-history {
  margin-top: 0.88rem;
}

.dai-history__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
}

.dai-history__head h3 {
  margin: 0;
  color: #163a63;
  font-size: 1.06rem;
}

.dai-history__head p {
  margin: 0;
  color: #5f7a98;
  font-size: 0.82rem;
}

.dai-history__list {
  margin-top: 0.6rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 0.55rem;
}

.dai-history-item {
  min-width: 0;
  border: 1px solid #d8e5f3;
  border-radius: 13px;
  background: #fdfefe;
  padding: 0.62rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.dai-history-item__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.dai-history-item__meta {
  margin: 0.35rem 0 0;
  font-size: 0.79rem;
  color: #597591;
}

.dai-history-item__text {
  margin: 0.34rem 0 0;
  color: #2f5178;
  font-size: 0.89rem;
  line-height: 1.46;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.dai-history-item__error {
  margin: 0.42rem 0 0;
  color: #8b2f45;
  font-size: 0.83rem;
  line-height: 1.4;
  overflow-wrap: anywhere;
  word-break: break-word;
}

body.pai-modal-open {
  overflow: hidden;
}

.pai-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 0.7rem;
}

.pai-workbench-shell {
  overflow: visible;
}

.pai-workbench {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  gap: 0.85rem;
  align-items: start;
}

.pai-gallery-panel,
.pai-editor-panel {
  border: 1px solid #d5e3f2;
  border-radius: 16px;
  background: #f9fcff;
  padding: 0.72rem;
  min-height: 240px;
}

.pai-panel-head {
  margin-bottom: 0.55rem;
}

.pai-panel-head h2 {
  margin: 0;
  color: #163a63;
  font-size: 1.06rem;
}

.pai-panel-head p {
  margin: 0.2rem 0 0;
  color: #5a7594;
  font-size: 0.82rem;
}

.pai-gallery-grid {
  display: grid;
  gap: 0.55rem;
}

.pai-gallery-card {
  border: 1px solid #cfe0f0;
  border-radius: 13px;
  background: #ffffff;
  overflow: hidden;
  padding: 0;
  cursor: pointer;
  text-align: left;
  color: inherit;
  box-shadow: 0 10px 24px rgba(14, 41, 69, 0.08);
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.pai-gallery-card:hover {
  transform: translateY(-2px);
  border-color: #98c2de;
  box-shadow: 0 14px 28px rgba(19, 56, 90, 0.14);
}

.pai-gallery-card.is-active {
  border-color: #3fa3c8;
  box-shadow: 0 0 0 2px rgba(69, 174, 205, 0.22), 0 14px 28px rgba(19, 56, 90, 0.14);
}

.pai-gallery-card__media {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #e9f2fb;
}

.pai-gallery-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.24s ease;
}

.pai-gallery-card__media img[data-preview-src]:not([data-preview-src=""]) {
  cursor: zoom-in;
}

.pai-gallery-card:hover .pai-gallery-card__media img {
  transform: scale(1.04);
}

.pai-gallery-card__overlay {
  position: absolute;
  inset: auto 0 0 0;
  padding: 0.44rem 0.55rem;
  background: linear-gradient(180deg, rgba(16, 36, 59, 0), rgba(16, 36, 59, 0.84));
  color: #fff;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.pai-gallery-card:hover .pai-gallery-card__overlay {
  opacity: 1;
}

.pai-gallery-card__meta {
  padding: 0.52rem 0.58rem 0.58rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.42rem;
}

.pai-gallery-card__meta strong {
  color: #153a63;
  font-size: 0.94rem;
}

.pai-gallery-card__state {
  display: grid;
  gap: 0.14rem;
  justify-items: end;
}

.pai-gallery-card__state small {
  color: #5d7898;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.pai-editor-empty {
  min-height: 320px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #4e6a89;
  gap: 0.32rem;
}

.pai-editor-empty strong {
  color: #12365e;
  font-size: 1.05rem;
}

.pai-editor-content {
  position: relative;
  display: grid;
  gap: 0.7rem;
}

.pai-editor-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.72rem;
  align-items: start;
}

.pai-editor-main {
  min-width: 0;
  display: grid;
  gap: 0.7rem;
}

.pai-editor-sidebar {
  min-width: 0;
}

.pai-editor-sidebar--horizontal {
  width: 100%;
}

.pai-editor-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.55rem;
}

.pai-editor-top h2 {
  margin: 0;
  color: #12375f;
  font-size: 1.18rem;
}

.pai-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.42rem;
}

.pai-history {
  border: 1px solid #d6e5f5;
  border-radius: 14px;
  background: #ffffff;
  padding: 0.62rem;
  display: grid;
  gap: 0.55rem;
}

.pai-history__head h3 {
  margin: 0;
  color: #173a63;
  font-size: 0.98rem;
}

.pai-history__head p {
  margin: 0.12rem 0 0;
}

.pai-history__list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 0.52rem;
}

.pai-history-item {
  border: 1px solid #d5e4f4;
  border-radius: 12px;
  background: #f8fcff;
  padding: 0.4rem;
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 0.46rem;
  align-items: center;
  text-align: left;
  color: inherit;
  cursor: pointer;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.pai-history-item:hover {
  border-color: #99c4df;
  box-shadow: 0 10px 20px rgba(26, 64, 98, 0.12);
  transform: translateY(-1px);
}

.pai-history-item.is-active {
  border-color: #4caecf;
  box-shadow: 0 0 0 2px rgba(66, 176, 206, 0.24);
  background: #f2fbff;
}

.pai-history-item img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid #d5e5f5;
  background: #edf4fb;
}

.pai-history-item img[data-preview-src]:not([data-preview-src=""]) {
  cursor: zoom-in;
}

.pai-history-item__meta {
  min-width: 0;
  display: grid;
  gap: 0.12rem;
}

.pai-history-item__meta strong {
  color: #163964;
  font-size: 0.8rem;
}

.pai-history-item__meta span {
  color: #486483;
  font-size: 0.72rem;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pai-history-item__meta small {
  color: #637f9d;
  font-size: 0.68rem;
}

.pai-history-item__tags {
  grid-column: 1 / -1;
}

.pai-editor-form {
  border: 1px solid #d8e6f5;
  border-radius: 14px;
  background: #fff;
  padding: 0.62rem;
  display: grid;
  gap: 0.45rem;
}

.pai-editor-form--studio {
  gap: 0.72rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-areas:
    "head head"
    "generate generate"
    "catalog catalog"
    "profile manual";
  align-items: start;
}

.pai-editor-form--studio .pai-studio-head {
  grid-area: head;
}

.pai-editor-form--studio .pai-generate-line {
  grid-area: generate;
}

.pai-tool-card--catalog {
  grid-area: catalog;
}

.pai-tool-card--profile {
  grid-area: profile;
}

.pai-tool-card--manual {
  grid-area: manual;
}

.pai-studio-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.pai-sidebar-title {
  margin: 0 0 0.14rem;
  color: #153a63;
  font-size: 1.02rem;
}

.pai-studio-count {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  border: 1px solid #cce0f3;
  border-radius: 999px;
  background: #f4fbff;
  color: #30577a;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.2rem 0.52rem;
}

.pai-studio-count strong {
  color: #14436f;
  font-size: 0.88rem;
}

.pai-tool-card {
  border: 1px solid #d9e7f5;
  border-radius: 12px;
  background: linear-gradient(180deg, #fbfeff 0%, #f5faff 100%);
  padding: 0.62rem 0.68rem;
  display: grid;
  gap: 0.4rem;
  align-content: start;
  height: 100%;
}

.pai-tool-card__head {
  display: grid;
  gap: 0.18rem;
}

.pai-tool-card__head--inline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.pai-tool-card__head h4 {
  margin: 0;
  color: #173e67;
  font-size: 0.86rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.pai-tool-card__head p {
  margin: 0.1rem 0 0;
  color: #5a7594;
  font-size: 0.76rem;
}

.pai-inline-link {
  border: 0;
  background: transparent;
  color: #3b6286;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  cursor: pointer;
  padding: 0.1rem 0.15rem;
}

.pai-inline-link:hover,
.pai-inline-link:focus-visible {
  color: #184d72;
  text-decoration: underline;
}

.pai-catalog-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-content: start;
  gap: 0.38rem;
}

.pai-catalog-item {
  position: relative;
  border: 1px solid #d2e2f1;
  border-radius: 999px;
  background: #f6fbff;
  color: #2a5275;
  cursor: pointer;
  min-height: 38px;
  max-width: 100%;
  padding: 0.4rem 0.56rem 0.4rem 1.9rem;
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.16s ease, background-color 0.18s ease;
}

.pai-catalog-item:hover {
  border-color: #9fc9df;
  box-shadow: 0 8px 14px rgba(17, 65, 98, 0.12);
  transform: translateY(-0.5px);
}

.pai-catalog-item input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.pai-catalog-item__check {
  position: absolute;
  left: 0.52rem;
  top: 50%;
  transform: translateY(-50%);
  width: 0.9rem;
  height: 0.9rem;
  border-radius: 999px;
  border: 1px solid #b7d4e8;
  background: #ffffff;
  color: #64a6c5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.5rem;
  transition: all 0.2s ease;
}

.pai-catalog-item__head {
  color: #193f67;
  font-size: 0.73rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  line-height: 1.2;
  white-space: normal;
}

.pai-catalog-item:has(input:checked) {
  border-color: #49adcd;
  background: #e8f8ff;
  box-shadow: 0 0 0 2px rgba(60, 178, 208, 0.2), 0 10px 16px rgba(18, 78, 112, 0.14);
}

.pai-catalog-item:has(input:checked) .pai-catalog-item__check {
  border-color: #49adcd;
  background: #49adcd;
  color: #ffffff;
}

.pai-generate-line {
  margin-top: 0.18rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem;
  flex-wrap: nowrap;
  border: 1px solid #d7e6f4;
  border-radius: 12px;
  background: #f8fcff;
  padding: 0.52rem 0.62rem;
}

.pai-generate-line .dash-row-meta {
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
}

.pai-generate-line .dash-btn {
  flex: 0 0 auto;
  align-self: flex-start;
}

.pai-inline-confirm {
  margin-top: 0.56rem;
  border: 1px solid #cde2f3;
  border-radius: 12px;
  background: #f3faff;
  padding: 0.52rem 0.6rem;
}

.pai-confirm-actions {
  margin-top: 0.42rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.pai-loading-inline {
  position: absolute;
  inset: 0;
  border-radius: 14px;
  border: 1px solid #cde3f5;
  background: rgba(245, 250, 255, 0.92);
  backdrop-filter: blur(2px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  text-align: center;
  z-index: 2;
}

.pai-loading-inline strong {
  color: #12365c;
  font-size: 1rem;
}

.pai-loading-inline p {
  margin: 0;
  color: #4f6a89;
}

.pai-thumb-card {
  border: 1px solid #d4e1f0;
  border-radius: 14px;
  background: #ffffff;
  overflow: hidden;
  text-align: left;
  color: inherit;
  cursor: pointer;
  padding: 0;
  box-shadow: 0 14px 30px rgba(18, 50, 82, 0.08);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.pai-thumb-card:hover {
  transform: translateY(-3px);
  border-color: #9ec7de;
  box-shadow: 0 20px 34px rgba(22, 66, 104, 0.14);
}

.pai-thumb-media {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #edf4fb;
}

.pai-thumb-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.25s ease;
}

.pai-thumb-card:hover .pai-thumb-media img {
  transform: scale(1.05);
}

.pai-thumb-hover {
  position: absolute;
  inset: auto 0 0 0;
  padding: 0.5rem 0.62rem;
  background: linear-gradient(180deg, rgba(15, 34, 58, 0.0), rgba(15, 34, 58, 0.86));
  color: #fff;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.pai-thumb-card:hover .pai-thumb-hover {
  opacity: 1;
}

.pai-thumb-meta {
  padding: 0.62rem;
  display: grid;
  gap: 0.35rem;
}

.pai-thumb-meta strong {
  color: #173a64;
  font-size: 1rem;
}

.pai-generated-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  padding: 0.18rem 0.5rem;
  border-radius: 999px;
  border: 1px solid #9ed3b5;
  color: #226641;
  background: #edfbf2;
  font-size: 0.72rem;
  font-weight: 700;
}

.pai-generated-pill.is-muted {
  border-color: #d7e1ee;
  color: #58708f;
  background: #f4f8fd;
}

.pai-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 1.1rem;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.pai-modal[hidden] {
  display: none;
}

.pai-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 19, 34, 0.68);
  backdrop-filter: blur(2px);
}

.pai-modal__dialog {
  position: relative;
  width: min(1180px, 100%);
  margin: 0 auto;
  max-height: calc(100vh - 2rem);
  max-height: calc(100dvh - 2rem);
  overflow: auto;
  border-radius: 18px;
  border: 1px solid #d3e2f2;
  background: #f7fbff;
  box-shadow: 0 34px 60px rgba(12, 32, 55, 0.36);
  animation: paiModalIn 0.24s ease;
}

.pai-modal__dialog--sm {
  width: min(520px, 100%);
}

.pai-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  padding: 0.86rem 0.96rem;
  border-bottom: 1px solid #dce8f6;
  background: linear-gradient(120deg, #f8fcff 0%, #f2f9ff 100%);
}

.pai-modal__body {
  padding: 0.95rem;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  gap: 0.9rem;
}

.pai-modal__preview {
  border: 1px solid #d7e5f4;
  border-radius: 14px;
  background: #fff;
  padding: 0.7rem;
}

.pai-preview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.62rem;
}

.pai-preview-grid figure {
  margin: 0;
  border: 1px solid #d7e5f3;
  border-radius: 12px;
  overflow: hidden;
  background: #f8fbff;
}

.pai-preview-grid figcaption {
  margin: 0;
  padding: 0.36rem 0.46rem;
  border-bottom: 1px solid #e4eef8;
  font-size: 0.76rem;
  font-weight: 700;
  color: #4f6f92;
  background: #f2f8ff;
}

.pai-preview-grid img {
  width: 100%;
  height: 320px;
  object-fit: contain;
  display: block;
  background: #ecf4fb;
}

.pai-preview-grid img[data-preview-src]:not([data-preview-src=""]) {
  cursor: zoom-in;
}

.pai-empty {
  height: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #5c7897;
  font-size: 0.9rem;
  font-weight: 600;
  background: #ecf4fb;
}

.pai-image-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.5rem, 2.4vh, 1.1rem);
  isolation: isolate;
}

.pai-image-modal[hidden] {
  display: none;
}

.pai-image-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 17, 32, 0.78);
  backdrop-filter: blur(2px);
}

.pai-image-modal__dialog {
  position: relative;
  width: min(1360px, 100%);
  height: min(92vh, 92dvh);
  max-height: min(92vh, 92dvh);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  border-radius: 18px;
  border: 1px solid #d2e2f2;
  background: #f8fcff;
  box-shadow: 0 32px 56px rgba(8, 25, 44, 0.42);
  overflow: hidden;
}

.pai-image-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  padding: 0.72rem 0.86rem;
  border-bottom: 1px solid #dce8f6;
  background: linear-gradient(120deg, #f7fcff 0%, #eef8ff 100%);
}

.pai-image-modal__header strong {
  color: #143a64;
  font-size: 1rem;
}

.pai-image-modal__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.42rem;
}

.pai-image-modal__body {
  padding: 0.8rem;
  min-height: 0;
  overflow: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pai-image-modal__body img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  display: block;
  object-fit: contain;
  border-radius: 14px;
  background: #ebf4fd;
  border: 1px solid #d6e6f6;
}

.pai-generated-actions {
  margin-top: 0.66rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.42rem;
  align-items: center;
}

.pai-modal__editor {
  min-width: 0;
}

.pai-inline-shell {
  margin: 0;
  border: 1px solid #d7e6f4;
  border-radius: 14px;
  background: #fff;
}

.pai-label {
  margin-top: 0.48rem;
  margin-bottom: 0.38rem;
  font-weight: 700;
}

.pai-chip-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.48rem;
}

.pai-chip {
  position: relative;
  display: inline-flex;
  align-items: center;
  border: 1px solid #d4e2f1;
  border-radius: 999px;
  background: #f9fcff;
  color: #35597b;
  cursor: pointer;
  padding: 0.22rem 0.58rem;
  font-size: 0.76rem;
  font-weight: 700;
  transition: all 0.2s ease;
}

.pai-chip input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.pai-chip:has(input:checked) {
  border-color: #5bb6ce;
  background: #e7f9ff;
  color: #184f66;
  box-shadow: 0 10px 18px rgba(31, 134, 162, 0.18);
}

.pai-confirm-body {
  padding: 0.92rem;
  display: grid;
  gap: 0.52rem;
}

.pai-loading-box {
  text-align: center;
  padding: 1.18rem 1rem 1.24rem;
}

.pai-loading-box h2 {
  margin: 0.55rem 0 0.35rem;
  color: #173a64;
  font-size: 1.15rem;
}

.pai-loading-box p {
  margin: 0;
  color: #4d6889;
}

.pai-loader-ring {
  width: 54px;
  height: 54px;
  margin: 0 auto;
  border-radius: 50%;
  border: 4px solid #cfe4f5;
  border-top-color: #3992bf;
  animation: paiSpin 0.95s linear infinite;
}

@keyframes paiSpin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes paiModalIn {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.dash-wm-design-grid {
  margin-top: 0.9rem;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 0.7rem;
}

.dash-wm-design-card {
  position: relative;
  border: 1px solid #d5e2f2;
  border-radius: 12px;
  background: #fbfdff;
  padding: 0.55rem;
  box-shadow: 0 10px 18px rgba(18, 43, 72, 0.06);
}

.dash-wm-design-card.is-active {
  border-color: rgba(39, 175, 201, 0.8);
  box-shadow: 0 12px 22px rgba(19, 116, 140, 0.17);
}

.dash-wm-design-card__delete {
  position: absolute;
  top: 0.35rem;
  right: 0.35rem;
}

.dash-wm-design-card__delete-btn {
  width: 26px;
  height: 26px;
  border-radius: 999px;
  border: 1px solid #f2bcc6;
  background: #fff3f6;
  color: #9a3148;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.dash-wm-design-card__img {
  width: 100%;
  height: 120px;
  object-fit: contain;
  border-radius: 10px;
  border: 1px solid #dce7f6;
  background: #f4f9ff;
}

.dash-wm-design-card__body {
  margin-top: 0.45rem;
}

body.dash-modal-open {
  overflow: hidden;
}

.dash-modal {
  position: fixed;
  inset: 0;
  z-index: 2600;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.dash-modal.is-open {
  display: flex;
}

.dash-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2, 6, 23, 0.62);
}

.dash-modal__dialog {
  position: relative;
  z-index: 1;
  width: min(560px, calc(100% - 1rem));
  border-radius: 16px;
  border: 1px solid #d8e1ee;
  background: #ffffff;
  box-shadow: 0 24px 54px rgba(9, 24, 46, 0.35);
  padding: 1rem;
}

.dash-modal__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}

.dash-modal__head h2 {
  margin: 0;
  font-size: 1.08rem;
  line-height: 1.2;
  color: #1b3356;
}

.dash-modal__body {
  display: grid;
  gap: 0.45rem;
  color: #3d5474;
  font-size: 0.92rem;
}

.dash-modal__body p {
  margin: 0;
}

.dash-modal__loading {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  border-radius: 10px;
  border: 1px solid #d5e3f3;
  background: #f7fbff;
  padding: 0.72rem 0.76rem;
}

.dash-modal__spinner {
  width: 1.15rem;
  height: 1.15rem;
  border: 2px solid #d4e4f8;
  border-top-color: #2563a6;
  border-radius: 999px;
  animation: dash-spin 0.9s linear infinite;
  flex: 0 0 auto;
}

.dash-modal__loading-title {
  margin: 0;
  color: #1d3e67;
  font-weight: 700;
  font-size: 0.9rem;
}

.dash-modal__loading-text {
  margin: 0.2rem 0 0;
  color: #5d7392;
  font-size: 0.82rem;
}

.dash-modal__loading-progress {
  margin-top: 0.5rem;
  width: 100%;
  height: 0.32rem;
  border-radius: 999px;
  background: #dbe8f8;
  overflow: hidden;
}

.dash-modal__loading-progress span {
  display: block;
  width: 42%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #1f5ca8, #27afc9);
  animation: dash-loading-slide 1.2s ease-in-out infinite;
}

.dash-modal__success {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  border-radius: 10px;
  border: 1px solid #c8e2d2;
  background: #eefaf3;
  padding: 0.74rem 0.78rem;
}

.dash-modal__check {
  width: 2.1rem;
  height: 2.1rem;
  border-radius: 999px;
  background: linear-gradient(135deg, #22b07c, #1f8f65);
  box-shadow: 0 8px 18px rgba(31, 143, 101, 0.22);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  animation: dash-success-pop 0.35s ease-out;
  flex: 0 0 auto;
}

.dash-modal__check > span {
  width: 0.52rem;
  height: 0.9rem;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg) scale(0.7);
  animation: dash-success-check 0.35s ease-out 0.1s forwards;
  opacity: 0;
}

.dash-modal__success-title {
  margin: 0;
  color: #1f6948;
  font-weight: 700;
  font-size: 0.93rem;
}

.dash-modal__success-text {
  margin: 0.18rem 0 0;
  color: #3e5f4c;
  font-size: 0.84rem;
}

.dash-modal__cost {
  margin-top: 0.35rem !important;
  border-radius: 10px;
  border: 1px solid #f0d8a6;
  background: #fff8e9;
  color: #7b561d;
  padding: 0.58rem 0.66rem;
}

.pai-generate-modal__dialog {
  width: min(560px, calc(100% - 1rem));
}

.pai-batch-modal__dialog {
  width: min(980px, calc(100% - 1rem));
  max-height: min(90vh, 90dvh);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.pai-batch-modal__body {
  min-height: 260px;
  max-height: min(64vh, 64dvh);
  overflow: auto;
  padding-right: 0.1rem;
}

.pai-batch-options {
  margin-top: 0.35rem;
  border: 1px solid #d7e5f4;
  border-radius: 12px;
  background: #f7fbff;
  padding: 0.62rem 0.72rem;
}

.pai-batch-options h3 {
  margin: 0;
  color: #1a416a;
  font-size: 0.9rem;
}

.pai-batch-options ul {
  margin: 0.45rem 0 0;
  padding-left: 1rem;
  display: grid;
  gap: 0.3rem;
  color: #406181;
  font-size: 0.86rem;
}

.pai-batch-options li strong {
  color: #173d66;
}

.pai-batch-progress-list {
  margin-top: 0.62rem;
  display: grid;
  gap: 0.4rem;
}

.pai-batch-progress-item {
  border: 1px solid #d4e4f2;
  border-radius: 12px;
  background: #fbfdff;
  padding: 0.52rem 0.62rem;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.58rem;
}

.pai-batch-progress-item strong {
  color: #173e67;
  font-size: 0.88rem;
}

.pai-batch-progress-item__meta {
  color: #567492;
  font-size: 0.8rem;
}

.dash-modal__actions {
  margin-top: 0.9rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.dash-modal__feedback {
  border-radius: 10px;
  border: 1px solid #c4ddcf;
  background: #eefaf3;
  color: #1e6b48;
  padding: 0.62rem 0.68rem;
  font-size: 0.88rem;
  font-weight: 600;
}

.dash-modal__feedback.is-error {
  border-color: #edc6cf;
  background: #fff4f6;
  color: #8a2e44;
}

@keyframes dash-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes dash-loading-slide {
  0% {
    transform: translateX(-120%);
  }
  50% {
    transform: translateX(70%);
  }
  100% {
    transform: translateX(230%);
  }
}

@keyframes dash-success-pop {
  0% {
    transform: scale(0.6);
    opacity: 0.5;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes dash-success-check {
  0% {
    opacity: 0;
    transform: rotate(45deg) scale(0.2);
  }
  100% {
    opacity: 1;
    transform: rotate(45deg) scale(1);
  }
}

.dash-empty-row {
  text-align: center;
  color: #5e728d;
  padding: 1rem 0.3rem;
}

.dash-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.32rem;
}

.dash-page-link {
  min-width: 2rem;
  height: 2rem;
  padding: 0 0.55rem;
  border-radius: 10px;
  border: 1px solid #d4dfef;
  background: #fff;
  color: #2f4f7b;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-size: 0.85rem;
  font-weight: 700;
}

.dash-page-link.is-active {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(110deg, var(--bar-left-color, #1f5ca8), var(--bar-right-color, #27afc9));
}

.dash-page-link.is-disabled {
  opacity: 0.38;
  cursor: default;
}

.dash-form-shell {
  padding: 1rem;
}

.dash-form-shell .dash-section-head h2 {
  font-size: 1.2rem;
}

.dash-form-shell p {
  margin: 0;
}

.dash-form-shell p + p {
  margin-top: 0.7rem;
}

.dash-form-shell label {
  color: #385377;
  font-weight: 700;
}

.dash-form-shell input,
.dash-form-shell textarea,
.dash-form-shell select {
  border-color: #d6dfec;
}

.dash-form-grid {
  display: grid;
  gap: 0.7rem;
}

.dash-form-grid--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dash-form-grid--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dash-price-grid {
  display: grid;
  gap: 0.7rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dash-map-selector {
  height: 320px;
  border-radius: 12px;
  border: 1px solid #cddcf0;
  overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.45);
  margin-top: 0.2rem;
}

.dash-subtitle {
  margin: 0 0 0.6rem;
  color: #1b3d67;
  font-size: 1rem;
}

.dash-upload-inline {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.dash-gallery-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
}

.dash-gallery-count {
  border-radius: 999px;
  padding: 0.24rem 0.72rem;
  border: 1px solid #d4e1f2;
  background: #f4f8fe;
  color: #355578;
  font-size: 0.79rem;
  font-weight: 700;
}

.dash-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 0.8rem;
}

.dash-gallery-card {
  border: 1px solid #d7e3f3;
  border-radius: 14px;
  overflow: hidden;
  background: linear-gradient(180deg, #ffffff 0%, #f6f9ff 100%);
  box-shadow: 0 10px 24px rgba(18, 45, 78, 0.08);
  position: relative;
  display: flex;
  flex-direction: column;
}

.dash-gallery-card.is-cover {
  border-color: #f0cf85;
  box-shadow: 0 12px 26px rgba(172, 124, 35, 0.22);
}

.dash-gallery-media {
  aspect-ratio: 4 / 3;
  background: #eaf1fb;
  overflow: hidden;
}

.dash-gallery-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.32s ease;
}

.dash-gallery-card:hover .dash-gallery-thumb {
  transform: scale(1.03);
}

.dash-gallery-chip {
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  z-index: 2;
  border-radius: 999px;
  padding: 0.15rem 0.5rem;
  border: 1px solid rgba(20, 87, 69, 0.2);
  background: rgba(232, 255, 246, 0.92);
  color: #1a6f58;
  font-size: 0.71rem;
  font-weight: 800;
  letter-spacing: 0.01em;
}

.dash-gallery-chip.is-pending {
  border-color: rgba(141, 107, 30, 0.25);
  background: rgba(255, 246, 224, 0.94);
  color: #8b5a17;
}

.dash-gallery-chip.is-cover {
  border-color: rgba(172, 119, 25, 0.3);
  background: rgba(255, 244, 214, 0.94);
  color: #84540f;
}

.dash-gallery-delete {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  z-index: 2;
  padding: 0.22rem 0.55rem;
  font-size: 0.73rem;
}

.dash-gallery-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.56rem 0.64rem 0.64rem;
  border-top: 1px solid #dde7f4;
}

.dash-gallery-id {
  margin: 0;
  min-width: 0;
  display: grid;
  gap: 0.02rem;
}

.dash-gallery-id-label {
  color: #6a809d;
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  line-height: 1.1;
}

.dash-gallery-id-main {
  color: #153b66;
  font-size: 0.94rem;
  font-weight: 800;
  line-height: 1.1;
}

.dash-gallery-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem;
}

.dash-gallery-empty {
  margin: 0.2rem 0 0;
}

#upload-preview {
  margin-top: 0.8rem;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 0.75rem;
}

.dash-upload-preview-card {
  border: 1px dashed #c2d5ed;
  background: #f8fbff;
  border-radius: 12px;
  padding: 0.45rem;
  display: grid;
  gap: 0.44rem;
}

.dash-upload-preview-thumb {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid #d5e2f3;
  display: block;
}

.dash-upload-preview-name {
  margin: 0;
  color: #355578;
  font-size: 0.76rem;
  font-weight: 700;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dash-upload-preview-card .progress {
  height: 0.42rem;
  border-radius: 999px;
  overflow: hidden;
  background: #d8e4f4;
}

.dash-upload-preview-card .progress-bar {
  background: linear-gradient(110deg, #2b8db8 0%, #53c1b0 100%);
}

@media (max-width: 767.98px) {
  .dash-gallery-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .dash-gallery-grid,
  #upload-preview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 499.98px) {
  .dash-gallery-grid,
  #upload-preview {
    grid-template-columns: minmax(0, 1fr);
  }
}

.dash-form-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.dash-inline-success {
  margin-top: 0.55rem;
  border-radius: 10px;
  border: 1px solid rgba(27, 138, 98, 0.25);
  background: rgba(35, 167, 118, 0.09);
  color: #1d7556;
  padding: 0.5rem 0.62rem;
  font-weight: 700;
}

.dash-photo-preview {
  margin-top: 0.2rem;
}

.dash-confirm-shell {
  padding: 1rem;
}

.dash-settings-shell {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 0;
  overflow: visible;
  border: 1px solid #dbe7f5;
  box-shadow: 0 18px 34px rgba(11, 31, 56, 0.1);
}

.dash-settings-tabs {
  border-right: 1px solid #dce8f6;
  background: linear-gradient(180deg, #f8fbff 0%, #f3f8ff 100%);
  padding: 1rem 0.9rem;
  display: grid;
  gap: 0.42rem;
  align-content: start;
  position: sticky;
  top: 118px;
  max-height: calc(100vh - 138px);
  overflow: auto;
}

.dash-settings-tabs__head {
  margin-bottom: 0.15rem;
  padding: 0.16rem 0.32rem 0.58rem;
  border-bottom: 1px solid #dce8f6;
}

.dash-settings-tabs__head h3 {
  margin: 0.22rem 0 0;
  color: #133862;
  font-size: 1rem;
  font-family: var(--ra-body-font, "Manrope"), "Segoe UI", sans-serif;
  font-weight: 800;
}

.dash-settings-tabs a {
  text-decoration: none;
  border-radius: 12px;
  border: 1px solid #d6e2f2;
  color: #35547b;
  font-size: 0.88rem;
  padding: 0.56rem 0.62rem;
  display: inline-flex;
  align-items: center;
  gap: 0.54rem;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 6px 14px rgba(13, 35, 67, 0.04);
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
  min-width: 0;
}

.dash-settings-tabs a i {
  width: 1.9rem;
  height: 1.9rem;
  border-radius: 10px;
  border: 1px solid #d5e2f2;
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #335781;
  flex-shrink: 0;
}

.dash-settings-tab__copy {
  display: grid;
  gap: 0.02rem;
}

.dash-settings-tab__copy strong {
  color: #20466f;
  font-size: 0.86rem;
  font-weight: 800;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dash-settings-tab__copy small {
  color: #5f7594;
  font-size: 0.74rem;
  font-weight: 600;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dash-settings-tabs a:hover {
  background: #f0f6ff;
  border-color: #c4d9f0;
  transform: translateY(-1px);
  box-shadow: 0 10px 18px rgba(13, 38, 72, 0.1);
}

.dash-settings-tabs a.is-active {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.1);
  background: linear-gradient(100deg, var(--bar-left-color, #1f5ca8), var(--bar-right-color, #27afc9));
  box-shadow: 0 10px 22px rgba(12, 46, 88, 0.22);
}

.dash-settings-tabs a.is-active i {
  border-color: rgba(255, 255, 255, 0.32);
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
}

.dash-settings-tabs a.is-active .dash-settings-tab__copy strong,
.dash-settings-tabs a.is-active .dash-settings-tab__copy small {
  color: #fff;
}

.dash-settings-content {
  padding: 1.06rem;
  background:
    radial-gradient(circle at 100% 0%, rgba(39, 175, 201, 0.07), transparent 34%),
    radial-gradient(circle at 0% 100%, rgba(31, 92, 168, 0.08), transparent 36%),
    rgba(255, 255, 255, 0.88);
}

.dash-settings-content .form-label,
.dash-settings-content label {
  color: #274a73;
  font-weight: 800;
}

.dash-settings-content input[type="text"],
.dash-settings-content input[type="number"],
.dash-settings-content input[type="email"],
.dash-settings-content input[type="url"],
.dash-settings-content textarea,
.dash-settings-content select {
  border-radius: 12px;
  border-color: #c6d8ef;
  background: #fff;
}

.dash-settings-content input:focus,
.dash-settings-content textarea:focus,
.dash-settings-content select:focus {
  border-color: #7fa9dc;
  box-shadow: 0 0 0 3px rgba(31, 92, 168, 0.13);
}

.dash-settings-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(430px, 42%);
  gap: 0.95rem;
  align-items: start;
}

.dash-settings-form > * {
  grid-column: 1;
  min-width: 0;
}

.dash-settings-form .dash-form-grid--2 {
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

.dash-settings-form .dash-preview-box {
  grid-column: 2;
  grid-row: 1 / 99;
  position: sticky;
  top: 124px;
  align-self: start;
}

.dash-settings-form .dash-form-actions {
  grid-column: 1;
  margin-top: 0.1rem;
  padding-top: 0.15rem;
}

.dash-settings-form .dash-preview-box .dash-live-preview {
  font-size: 13px;
}

.dash-settings-form .dash-preview-box .dash-live-topbar {
  padding: 0.44rem 0.56rem;
  gap: 0.42rem;
  font-size: 0.73em;
}

.dash-settings-form .dash-preview-box .dash-live-nav {
  padding: 0.42rem 0.52rem;
  gap: 0.45rem;
  align-items: flex-start;
}

.dash-settings-form .dash-preview-box .dash-live-logo {
  width: clamp(24px, calc(var(--pv-logo-size) * 0.72), 62px);
  height: clamp(24px, calc(var(--pv-logo-size) * 0.72), 62px);
}

.dash-settings-form .dash-preview-box .dash-live-brand-copy strong {
  max-width: min(170px, 34vw);
  font-size: clamp(0.9em, 1.1vw, 1.02em);
}

.dash-settings-form .dash-preview-box .dash-live-brand-copy span {
  max-width: min(170px, 34vw);
  font-size: clamp(0.72em, 0.98vw, 0.82em);
}

.dash-settings-form .dash-preview-box .dash-live-menu {
  flex-wrap: wrap;
  justify-content: flex-end;
  row-gap: 0.15rem;
}

.dash-settings-form .dash-preview-box .dash-live-menu a {
  font-size: 0.74em;
  padding: 0.27rem 0.38rem;
}

.dash-settings-form .dash-preview-box .dash-live-menu a.is-cta {
  min-width: 58px;
}

.dash-style-preview .dash-live-preview {
  font-size: 13px;
}

.dash-style-preview .dash-live-topbar {
  padding: 0.44rem 0.56rem;
  gap: 0.42rem;
  font-size: 0.73em;
}

.dash-style-preview .dash-live-nav {
  padding: 0.42rem 0.52rem;
  gap: 0.45rem;
  align-items: flex-start;
}

.dash-style-preview .dash-live-logo {
  width: clamp(24px, calc(var(--pv-logo-size) * 0.72), 62px);
  height: clamp(24px, calc(var(--pv-logo-size) * 0.72), 62px);
}

.dash-style-preview .dash-live-brand-copy strong {
  max-width: min(170px, 34vw);
  font-size: clamp(0.9em, 1.1vw, 1.02em);
}

.dash-style-preview .dash-live-brand-copy span {
  max-width: min(170px, 34vw);
  font-size: clamp(0.72em, 0.98vw, 0.82em);
}

.dash-style-preview .dash-live-menu {
  flex-wrap: wrap;
  justify-content: flex-end;
  row-gap: 0.15rem;
}

.dash-style-preview .dash-live-menu a {
  font-size: 0.74em;
  padding: 0.27rem 0.38rem;
}

.dash-style-preview .dash-live-menu a.is-cta {
  min-width: 58px;
}

.dash-settings-form--images .dash-brand-grid {
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

.dash-settings-form--images .dash-form-grid--2 {
  grid-template-columns: minmax(0, 1fr);
}

.dash-settings-hero-gallery {
  display: grid;
  gap: 0.95rem;
}

.dash-hero-gallery-head {
  padding: 1rem;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.8rem;
}

.dash-hero-gallery-head h2 {
  margin: 0.25rem 0 0;
  color: #103159;
}

.dash-hero-preview-shell {
  display: grid;
  gap: 0.55rem;
  margin-bottom: 0.65rem;
}

.dash-hero-preview-head h3 {
  margin: 0;
  color: #153b66;
  font-size: 1rem;
}

.dash-hero-preview-head p {
  margin: 0.25rem 0 0;
  color: #5c7595;
  font-size: 0.84rem;
}

.dash-hero-preview-stage {
  position: relative;
  min-height: 240px;
  border-radius: 14px;
  border: 1px solid #cfe0f5;
  overflow: hidden;
  background: #eaf1fb;
}

.dash-hero-preview-stage img {
  width: 100%;
  height: 100%;
  min-height: 240px;
  object-fit: cover;
  object-position: center top;
  display: block;
  image-rendering: auto;
}

.dash-hero-preview-empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #4f6788;
  font-weight: 700;
  z-index: 0;
  text-align: center;
  padding: 1rem;
}

.dash-hero-preview-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, rgba(8, 22, 45, 0.55), rgba(8, 22, 45, 0.15));
  pointer-events: none;
  z-index: 1;
}

.dash-hero-preview-caption {
  position: absolute;
  left: 0.85rem;
  right: 0.85rem;
  bottom: 0.75rem;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: linear-gradient(
    122deg,
    var(--bar-left-color, #0d47a1),
    var(--bar-right-color, #27afc9)
  );
  background: linear-gradient(
    122deg,
    color-mix(in srgb, var(--bar-left-color, #0d47a1) 82%, transparent),
    color-mix(in srgb, var(--bar-right-color, #27afc9) 64%, transparent)
  );
  backdrop-filter: blur(4px);
  color: #fff;
  padding: 0.6rem 0.68rem;
  z-index: 2;
  display: grid;
  gap: 0.16rem;
  box-shadow: inset 0 0 0 999px rgba(7, 16, 30, 0.12);
}

.dash-hero-preview-caption strong {
  font-size: 0.92rem;
  line-height: 1.2;
}

.dash-hero-preview-caption small {
  font-size: 0.76rem;
  color: rgba(255, 255, 255, 0.85);
}

.dash-hero-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 0.72rem;
}

.dash-hero-gallery-card {
  border-radius: 14px;
  border: 1px solid #d7e3f2;
  background: #fff;
  overflow: hidden;
  display: grid;
  box-shadow: 0 10px 22px rgba(12, 34, 64, 0.08);
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.dash-hero-gallery-card:hover {
  transform: translateY(-1px);
  border-color: #b9cfe9;
}

.dash-hero-gallery-card.is-selected {
  border-color: #4f89c8;
  box-shadow: 0 12px 26px rgba(21, 60, 112, 0.22);
}

.dash-hero-gallery-card__media {
  aspect-ratio: 16 / 10;
  background: #edf3fb;
}

.dash-hero-gallery-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.dash-hero-gallery-card__body {
  padding: 0.62rem;
  display: grid;
  gap: 0.36rem;
}

.dash-hero-gallery-card__body h3 {
  margin: 0;
  font-size: 0.92rem;
  color: #173b66;
}

.dash-hero-gallery-card__body p {
  margin: 0;
  font-size: 0.76rem;
  color: #607795;
}

.dash-hero-gallery-card__meta {
  margin-top: 0.1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem;
}

.dash-hero-gallery-card__actions {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.dash-hero-gallery-empty {
  grid-column: 1 / -1;
}

.dash-inline-check {
  display: inline-flex;
  align-items: center;
  gap: 0.46rem;
  color: #2a4f79;
  font-weight: 700;
}

.dash-preview-box {
  border-radius: 16px;
  border: 1px solid #d7e3f2;
  background: #f8fbff;
  padding: 0.82rem;
  box-shadow: 0 12px 24px rgba(12, 34, 64, 0.08);
}

.dash-preview-box h3 {
  margin: 0 0 0.55rem;
  color: #1b3d67;
  font-size: 0.96rem;
}

.dash-style-workbench {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(390px, 0.96fr);
  gap: 0.85rem;
  align-items: start;
}

.dash-style-controls {
  display: grid;
  gap: 0.75rem;
}

.dash-style-group {
  border-radius: 14px;
  border: 1px solid #d7e3f2;
  background: #f8fbff;
  padding: 0.78rem;
}

.dash-style-group__head {
  margin-bottom: 0.45rem;
}

.dash-style-group__head h3 {
  margin: 0.26rem 0 0;
  color: #1b3d67;
  font-size: 1rem;
  font-family: var(--ra-body-font, "Manrope"), "Segoe UI", sans-serif;
}

.dash-style-group .dash-form-grid {
  gap: 0.62rem;
}

.dash-font-lab {
  padding-top: 0.72rem;
}

.dash-font-preview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.55rem;
}

.dash-font-preview-card {
  border-radius: 12px;
  border: 1px solid #d7e3f2;
  background: #ffffff;
  padding: 0.62rem 0.68rem;
  box-shadow: 0 8px 18px rgba(13, 35, 67, 0.06);
}

.dash-font-preview-card__label {
  margin: 0;
  color: #5e728f;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.dash-font-preview-card__name {
  display: block;
  margin-top: 0.22rem;
  color: #143864;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.2;
}

.dash-font-preview-card__sample {
  margin: 0.35rem 0 0;
  color: #2f4f78;
  line-height: 1.55;
  font-size: 0.94rem;
}

.dash-font-select {
  border-radius: 11px;
}

.dash-palette-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.55rem;
  margin-bottom: 0.35rem;
}

.dash-style-hint {
  margin: 0;
  color: #5f738f;
  font-size: 0.86rem;
}

.dash-palette-toggle {
  white-space: nowrap;
  flex-shrink: 0;
}

.dash-palette-status {
  margin: 0 0 0.52rem;
  color: #5f7390;
  font-size: 0.78rem;
  font-weight: 700;
}

.dash-palette-presets {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.52rem;
  margin-bottom: 0.7rem;
}

.dash-palette-presets.is-expanded {
  max-height: 420px;
  overflow: auto;
  padding-right: 0.16rem;
}

.dash-palette-card {
  appearance: none;
  border-radius: 12px;
  border: 1px solid #d7e3f2;
  background: #ffffff;
  box-shadow: 0 6px 14px rgba(13, 35, 67, 0.06);
  padding: 0.5rem;
  text-align: left;
  display: grid;
  gap: 0.34rem;
  cursor: pointer;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.dash-palette-card:hover {
  transform: translateY(-1px);
  border-color: rgba(31, 92, 168, 0.34);
  box-shadow: 0 10px 18px rgba(13, 38, 72, 0.12);
}

.dash-palette-card.is-active {
  border-color: rgba(31, 92, 168, 0.65);
  box-shadow:
    0 0 0 1px rgba(31, 92, 168, 0.25),
    0 12px 22px rgba(13, 38, 72, 0.14);
}

.dash-palette-card__title {
  color: #1a3f6d;
  font-size: 0.84rem;
  font-weight: 800;
}

.dash-palette-card__bar {
  display: block;
  height: 0.62rem;
  border-radius: 999px;
  background: linear-gradient(95deg, var(--pal-left), var(--pal-right));
}

.dash-palette-card__swatches {
  display: inline-flex;
  align-items: center;
  gap: 0.26rem;
}

.dash-palette-card__swatches i {
  width: 0.74rem;
  height: 0.74rem;
  border-radius: 999px;
  background: var(--sw);
  border: 1px solid rgba(21, 35, 54, 0.2);
}

.dash-color-grid-ux {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.62rem;
}

.dash-color-control {
  border-radius: 12px;
  border: 1px solid #d8e3f2;
  background: #ffffff;
  padding: 0.5rem 0.55rem;
}

.dash-color-control label {
  display: block;
  margin-bottom: 0.3rem;
  color: #2f4e78;
  font-size: 0.82rem;
  font-weight: 700;
}

.dash-color-control__body {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.dash-color-control__body .form-control-color {
  width: 3.1rem;
  min-height: 2.1rem;
  border-radius: 9px;
  border: 1px solid #ccdaed;
  padding: 0.18rem;
  background: #f8fbff;
}

.dash-color-control__code {
  min-width: 6.4rem;
  border-radius: 999px;
  border: 1px solid #d4dfef;
  background: #f6f9ff;
  color: #26456d;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-align: center;
  padding: 0.22rem 0.48rem;
  line-height: 1.1;
}

.dash-style-preview {
  position: sticky;
  top: 124px;
  align-self: start;
}

.dash-style-preview .dash-live-preview {
  max-height: calc(100vh - 235px);
  overflow: auto;
}

.dash-style-preview-note {
  margin: 0.55rem 0 0;
  color: #5d7190;
  font-size: 0.82rem;
  line-height: 1.45;
}

.dash-style-actions {
  padding-top: 0.05rem;
}

.dash-live-preview {
  --pv-primary: #0d47a1;
  --pv-secondary: #27afc9;
  --pv-hover: #ff6f00;
  --pv-button-border: #ff6f00;
  --pv-bar-text: #ffffff;
  --pv-body-text: #1a2231;
  --pv-body-font: "Manrope";
  --pv-body-size: 16px;
  --pv-bar-font: "Playfair Display";
  --pv-header-name-font: "Playfair Display";
  --pv-header-tagline-font: "Merriweather";
  --pv-header-name-size: 22px;
  --pv-header-tagline-size: 13px;
  --pv-header-name-weight: 800;
  --pv-header-tagline-weight: 600;

  display: grid;
  gap: 0.7rem;
  border-radius: 14px;
  border: 1px solid #cfdced;
  background:
    radial-gradient(circle at 0% 0%, rgba(31, 92, 168, 0.08), transparent 34%),
    radial-gradient(circle at 100% 100%, rgba(242, 107, 29, 0.08), transparent 28%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(10, 30, 58, 0.08);
  padding: 0.7rem;
  color: var(--pv-body-text);
  font-family: var(--pv-body-font), "Manrope", "Segoe UI", sans-serif;
  font-size: var(--pv-body-size);
}

.dash-live-header {
  border-radius: 12px;
  border: 1px solid #d5e1f1;
  overflow: hidden;
  background: #fff;
}

.dash-live-topbar {
  min-height: 40px;
  padding: 0.56rem 0.72rem;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.65rem;
  color: var(--pv-bar-text);
  background: linear-gradient(92deg, var(--pv-primary), var(--pv-secondary));
  font-size: 0.78em;
  font-weight: 600;
  font-family: var(--pv-body-font), "Manrope", "Segoe UI", sans-serif;
}

.dash-live-topbar span {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  min-width: 0;
}

.dash-live-nav {
  min-height: 64px;
  padding: 0.52rem 0.65rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
}

.dash-live-brand {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.dash-live-logo {
  width: clamp(28px, var(--pv-logo-size), 86px);
  height: clamp(28px, var(--pv-logo-size), 86px);
  border-radius: 10px;
  background: #f2f7ff;
  border: 1px solid #d6e3f3;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: #4f6b8e;
  font-size: 0.72em;
  font-weight: 800;
}

.dash-live-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.dash-live-brand-copy {
  min-width: 0;
}

.dash-live-brand-copy strong {
  display: block;
  font-family: var(--pv-body-font), "Manrope", "Segoe UI", sans-serif;
  font-size: var(--pv-header-name-size);
  font-weight: var(--pv-header-name-weight);
  line-height: 1.08;
  color: var(--pv-body-text);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: min(360px, 56vw);
}

.dash-live-brand-copy span {
  display: block;
  margin-top: 0.1rem;
  font-family: var(--pv-body-font), "Manrope", "Segoe UI", sans-serif;
  font-size: var(--pv-header-tagline-size);
  font-weight: var(--pv-header-tagline-weight);
  line-height: 1.2;
  color: var(--pv-body-text);
  opacity: 0.82;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: min(360px, 56vw);
}

.dash-live-menu {
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
  margin-left: auto;
}

.dash-live-menu a {
  text-decoration: none;
  color: var(--pv-body-text);
  font-size: 0.9em;
  font-weight: 700;
  padding: 0.36rem 0.52rem;
  border-radius: 999px;
  font-family: var(--pv-body-font), "Manrope", "Segoe UI", sans-serif;
}

.dash-live-menu a.is-cta {
  color: var(--pv-bar-text);
  background: linear-gradient(96deg, var(--pv-primary), var(--pv-secondary));
  border: 1px solid var(--pv-button-border);
  min-width: 72px;
  text-align: center;
}

.dash-live-hero {
  border-radius: 12px;
  border: 1px solid var(--pv-button-border);
  background: linear-gradient(130deg, var(--pv-primary), var(--pv-secondary));
  padding: 0.72rem 0.8rem;
  color: var(--pv-bar-text);
}

.dash-live-kicker {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.13em;
  font-weight: 800;
  font-size: 0.66em;
  color: var(--pv-bar-text);
  opacity: 0.78;
}

.dash-live-hero h4,
.dash-live-card h5 {
  margin: 0.32rem 0 0;
  font-family: var(--pv-body-font), "Manrope", "Segoe UI", sans-serif;
  line-height: 1.15;
}

.dash-live-hero h4 {
  font-size: clamp(1em, 2.1vw, 1.32em);
  color: var(--pv-bar-text);
}

.dash-live-copy {
  margin: 0.4rem 0 0;
  line-height: 1.55;
  color: var(--pv-bar-text);
  opacity: 0.92;
  font-size: 0.86em;
}

.dash-live-interaction-row {
  margin-top: 0.52rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.36rem;
}

.dash-live-state {
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.45);
  background: rgba(255, 255, 255, 0.14);
  padding: 0.17rem 0.5rem;
  font-size: 0.73em;
  font-weight: 700;
  line-height: 1;
}

.dash-live-state--hover {
  color: #0f233f;
  background: var(--pv-hover);
  border-color: var(--pv-hover);
}

.dash-live-state--bar {
  color: var(--pv-bar-text);
}

.dash-live-state--body {
  color: var(--pv-body-text);
  background: #ffffff;
  border-color: rgba(255, 255, 255, 0.8);
}

.dash-live-grid {
  display: grid;
  gap: 0.55rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dash-live-card {
  border-radius: 12px;
  border: 1px solid #d3dfef;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 8px 18px rgba(11, 28, 52, 0.08);
  padding: 0.72rem;
}

.dash-live-card .dash-live-kicker {
  color: #587295;
}

.dash-live-card h5 {
  color: var(--pv-body-text);
  font-size: 1em;
}

.dash-live-card .dash-live-copy {
  color: var(--pv-body-text);
  opacity: 0.78;
}

.dash-live-btn {
  margin-top: 0.52rem;
  border-radius: 999px;
  border: 1px solid var(--pv-button-border);
  background: linear-gradient(95deg, var(--pv-primary), var(--pv-secondary));
  color: #fff;
  font-size: 0.78em;
  font-weight: 800;
  padding: 0.42rem 0.74rem;
}

.dash-live-highlight {
  color: var(--pv-hover);
  font-weight: 800;
}

.dash-live-chips {
  margin-top: 0.52rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.34rem;
}

.dash-live-chips span {
  border-radius: 999px;
  border: 1px solid #d7e2f2;
  background: #f5f9ff;
  color: var(--pv-body-text);
  font-size: 0.74em;
  font-weight: 700;
  padding: 0.18rem 0.45rem;
}

.dash-live-chips span:nth-child(2) {
  border-color: var(--pv-hover);
  color: var(--pv-hover);
}

.dash-live-footer {
  border-radius: 12px;
  border: 1px solid rgba(24, 57, 101, 0.2);
  background: linear-gradient(105deg, var(--pv-primary), var(--pv-secondary));
  color: #fff;
  padding: 0.6rem 0.7rem;
  display: grid;
  gap: 0.18rem;
  font-size: 0.74em;
}

.dash-live-footer p {
  margin: 0;
  color: var(--pv-bar-text);
}

.dash-live-favicon {
  margin-bottom: 0.18rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.45);
  background: rgba(255, 255, 255, 0.12);
}

.dash-live-favicon img {
  width: 1.1rem;
  height: 1.1rem;
  object-fit: contain;
}

.dash-brand-grid {
  display: grid;
  gap: 0.65rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dash-brand-grid--editor {
  align-items: start;
}

.dash-upload-card {
  border-radius: 12px;
  border: 1px solid #d6e1f1;
  background: #f9fbff;
  padding: 0.68rem;
  display: grid;
  gap: 0.55rem;
}

.dash-upload-card__head h3 {
  margin: 0;
  color: #173a64;
  font-size: 1rem;
}

.dash-upload-card__head p {
  margin: 0.24rem 0 0;
  color: #5b7191;
  font-size: 0.83rem;
}

.dash-upload-card__info {
  margin: 0;
  color: #4f6788;
  font-size: 0.82rem;
  line-height: 1.45;
}

.dash-upload-card__thumb {
  min-height: 98px;
  border-radius: 10px;
  border: 1px dashed #c4d6ec;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
}

.dash-upload-card__thumb img {
  max-width: 100%;
  max-height: 84px;
  object-fit: contain;
}

.dash-upload-card__thumb span {
  color: #677f9f;
  font-size: 0.82rem;
  font-weight: 700;
}

.dash-upload-card__thumb--favicon {
  min-height: 88px;
}

.dash-upload-card__thumb--favicon img {
  width: 48px;
  height: 48px;
}

.dash-upload-card__file {
  margin: 0;
  color: #566f91;
  font-size: 0.82rem;
  overflow-wrap: anywhere;
}

.dash-upload-card__file strong {
  overflow-wrap: anywhere;
}

.dash-upload-card__label {
  margin: 0;
  color: #2d507a;
  font-size: 0.82rem;
  font-weight: 700;
}

.dash-upload-card input[type="file"] {
  border-color: #c8d8ed;
  border-radius: 10px;
  background: #fff;
  font-size: 0.82rem;
}

.dash-upload-card__clear {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  width: fit-content;
  margin: 0.1rem 0 0;
  color: #375a83;
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
}

.dash-upload-card__clear input[type="checkbox"] {
  margin: 0;
  accent-color: var(--bar-left-color, #1f5ca8);
}

.dash-upload-card__clear.is-disabled {
  opacity: 0.58;
  cursor: not-allowed;
}

.dash-upload-card__error {
  margin: 0;
  border-radius: 10px;
  border: 1px solid rgba(167, 60, 92, 0.3);
  background: #fff5f8;
  color: #8d2a43;
  padding: 0.36rem 0.48rem;
  font-size: 0.78rem;
}

.dash-upload-card__error ul {
  margin: 0;
  padding-left: 1rem;
}

.dash-brand-preview {
  border-radius: 12px;
  border: 1px solid #d6e1f1;
  background: #f9fbff;
  padding: 0.65rem;
}

.dash-brand-preview p {
  margin: 0;
  color: #5d7190;
  font-size: 0.82rem;
  font-weight: 700;
}

.dash-brand-preview img {
  margin-top: 0.45rem;
  max-height: 62px;
  max-width: 100%;
  object-fit: contain;
}

.dash-brand-preview span {
  display: block;
  margin-top: 0.45rem;
  color: #6a7f9d;
  font-size: 0.86rem;
}

.dash-brand-preview small {
  display: block;
  margin-top: 0.42rem;
  color: #6c7f9a;
  font-size: 0.78rem;
}

.dash-color-grid .form-control-color {
  width: 100%;
  min-height: 42px;
  border-radius: 11px;
}

.dash-login-body {
  padding-top: 0;
}

.dash-login-wrap {
  width: min(460px, calc(100% - 1rem));
  margin: auto;
  padding: 1rem 0;
}

.dash-login-card {
  padding: 1rem;
}

.dash-login-brand {
  text-align: center;
  margin-bottom: 0.8rem;
}

.dash-login-logo {
  max-height: 72px;
  max-width: 160px;
  object-fit: contain;
}

.dash-login-submit {
  width: 100%;
}

.dash-login-meta {
  margin-top: 0.7rem;
  color: #5e728d;
  font-size: 0.9rem;
}

.dash-login-meta p {
  margin: 0.25rem 0 0;
  display: inline-flex;
  align-items: center;
  gap: 0.34rem;
}

body.ra-modern #save-success {
  font-weight: 700;
}

body.ra-modern .display-5 {
  font-size: clamp(2rem, 5vw, 2.8rem);
  font-weight: 800;
  color: #123f7a;
}

body.ra-modern .btn-toolbar,
body.ra-modern .btn-group {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

body.ra-modern .btn-toolbar {
  flex-wrap: wrap;
}

body.ra-modern .btn-group > .btn {
  margin: 0;
}

@media (max-width: 1160px) {
  .dash-home-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dai-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dash-property-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dash-sections-grid,
  .dash-cats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dash-style-workbench {
    grid-template-columns: minmax(0, 1fr) minmax(330px, 0.92fr);
  }

  .dai-layout {
    grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
  }

  .dai-property-list {
    grid-template-columns: 1fr;
  }

  .pai-editor-form--studio {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "head head"
      "generate generate"
      "catalog catalog"
      "profile manual";
  }

  .pai-catalog-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .dash-panelbar__inner {
    width: min(1240px, calc(100% - 0.86rem));
    display: grid;
    justify-content: stretch;
    gap: 0.5rem;
  }

  .dash-panelnav {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 0.2rem;
  }

  .dash-panel-actions {
    justify-content: flex-end;
    flex-wrap: wrap;
  }

  .dash-settings-shell {
    grid-template-columns: 1fr;
  }

  .dash-settings-tabs {
    position: static;
    max-height: none;
    overflow: visible;
    border-right: 0;
    border-bottom: 1px solid #dbe5f2;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dash-settings-tabs__head {
    grid-column: 1 / -1;
  }

  .dash-settings-form {
    grid-template-columns: 1fr;
  }

  .dash-settings-form .dash-preview-box {
    grid-column: 1;
    grid-row: auto;
    position: static;
  }

  .dash-live-grid {
    grid-template-columns: 1fr;
  }

  .dash-style-workbench {
    grid-template-columns: 1fr;
  }

  .dash-style-preview {
    position: static;
  }

  .dash-style-preview .dash-live-preview {
    max-height: none;
    overflow: visible;
  }

  .dash-color-grid-ux {
    grid-template-columns: 1fr;
  }

  .dai-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1600px) {
  .dash-settings-form {
    grid-template-columns: 1fr;
  }

  .dash-settings-form .dash-preview-box {
    grid-column: 1;
    grid-row: auto;
    position: static;
  }
}

@media (max-width: 1200px) {
  .dash-watermark-branding {
    grid-template-columns: 220px minmax(0, 1fr);
  }

  .dash-watermark-sidebar {
    grid-column: 1 / -1;
  }

  .dash-watermark-opacity-actions .dash-mini-btn {
    width: auto;
  }
}

@media (max-width: 860px) {
  .dash-home-hero {
    grid-template-columns: 1fr;
  }

  .dash-home-highlight {
    text-align: left;
  }

  .dash-page-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .dash-upload-inline {
    flex-direction: column;
    align-items: stretch;
  }

  .dash-form-grid--3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dash-palette-presets {
    grid-template-columns: 1fr;
  }

  .dash-palette-toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .dash-palette-toggle {
    width: 100%;
    justify-content: center;
  }

  .dash-watermark-branding {
    grid-template-columns: 1fr;
  }

  .dash-watermark-grid {
    grid-template-columns: 1fr;
  }

  .pai-modal__body {
    grid-template-columns: 1fr;
  }

  .pai-workbench {
    grid-template-columns: 1fr;
  }

  .pai-editor-top {
    flex-direction: column;
    align-items: flex-start;
  }

  .pai-editor-layout {
    grid-template-columns: 1fr;
  }

  .pai-editor-form--studio {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "head head"
      "generate generate"
      "catalog catalog"
      "profile manual";
  }

  .pai-preview-grid img,
  .pai-empty {
    height: 260px;
  }

  .dash-ai-flow {
    grid-template-columns: 1fr;
  }

  .dash-ai-cost-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dai-panel__head--actions {
    flex-direction: column;
    align-items: stretch;
  }

  .dai-panel__head--actions .dash-btn {
    width: 100%;
    justify-content: center;
  }

  .dai-generate-controls {
    width: 100%;
    min-width: 0;
  }

  .dai-history__head {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 680px) {
  body.ra-modern .content-wrapper {
    padding-top: 0.55rem;
  }

  body.ra-modern .content-wrapper > .container {
    width: min(1240px, calc(100% - 0.86rem));
  }

  body.ra-modern .site-footer {
    width: min(1240px, calc(100% - 0.86rem));
  }

  .dash-shell {
    border-radius: 16px;
  }

  .dash-home-hero,
  .dash-home-modules,
  .dash-home-sections,
  .dash-form-shell,
  .dash-settings-content,
  .dash-confirm-shell {
    padding: 0.85rem;
  }

  .dash-home-stats,
  .dash-sections-grid,
  .dash-cats-grid,
  .dash-property-grid,
  .dash-watermark-grid,
  .dash-form-grid--2,
  .dash-form-grid--3,
  .dash-price-grid,
  .dash-brand-grid,
  .dash-settings-tabs {
    grid-template-columns: 1fr;
  }

  .dai-metrics {
    grid-template-columns: 1fr;
  }

  .dai-history__list {
    grid-template-columns: 1fr;
  }

  .dash-module-card {
    flex-direction: column;
    align-items: flex-start;
  }

  .dash-property-card {
    aspect-ratio: auto;
    min-height: 0;
    grid-template-rows: 180px 1fr;
  }

  .dash-live-nav {
    flex-direction: column;
    align-items: flex-start;
  }

  .dash-live-menu {
    width: 100%;
    justify-content: flex-start;
    overflow-x: auto;
    padding-bottom: 0.1rem;
  }

  .dash-ai-cost-grid {
    grid-template-columns: 1fr;
  }

  .pai-workbench {
    grid-template-columns: 1fr;
  }

  .pai-editor-layout {
    grid-template-columns: 1fr;
  }

  .pai-editor-form--studio {
    grid-template-columns: 1fr;
  }

  .pai-editor-form--studio > * {
    grid-column: 1 / -1;
  }

  .pai-action-row,
  .pai-confirm-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .pai-generate-line {
    flex-direction: row;
    align-items: flex-start;
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .pai-generate-line .dash-btn {
    width: auto;
  }

  .pai-gallery-card__meta {
    flex-direction: column;
    align-items: flex-start;
  }

  .pai-gallery-card__state {
    justify-items: start;
  }

  .pai-gallery {
    grid-template-columns: 1fr;
  }

  .pai-preview-grid {
    grid-template-columns: 1fr;
  }

  .pai-preview-grid img,
  .pai-empty {
    height: 220px;
  }

  .pai-generated-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .pai-chip-grid {
    gap: 0.3rem;
  }

  .pai-studio-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .pai-catalog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.3rem;
  }

  .pai-history__list {
    grid-template-columns: 1fr;
  }

  .pai-modal {
    padding: 0.7rem;
  }

  .pai-batch-modal__dialog {
    width: min(980px, calc(100% - 0.4rem));
    padding: 0.82rem;
  }

  .pai-batch-progress-item {
    grid-template-columns: 1fr;
    align-items: flex-start;
  }

  .pai-image-modal {
    padding: 0.5rem;
  }

  .pai-image-modal__dialog {
    height: min(96vh, 96dvh);
    max-height: min(96vh, 96dvh);
  }

  .pai-image-modal__header {
    flex-direction: column;
    align-items: flex-start;
  }

  .pai-image-modal__actions {
    width: 100%;
  }

  .pai-image-modal__actions .dash-btn {
    flex: 1 1 auto;
    justify-content: center;
  }

  .pai-image-modal__body {
    padding: 0.5rem;
  }

  .dash-ai-toolbar-group {
    width: 100%;
  }

  .dash-panelbar {
    display: none;
  }

  .dash-style-group {
    padding: 0.72rem;
  }
}
