/* —— Unified canvas + full-width page case —— */
:root {
  --sc-canvas: var(--bento-bg, var(--dash-bg));
  --sc-box: var(--bento-elev, var(--dash-panel));
  --sc-box-2: var(--bento-elev-2, var(--dash-bg));
  --sc-box-line: var(--bento-line, var(--dash-line));
  --sc-box-radius: 18px;
  --sc-box-pad: 18px;
  --sc-page-gap: 12px;
  --sc-page-pad: 12px;
  --sc-page-max: none;
}

.dash-main,
.dash-view,
.stage.page-sheet,
.page-case,
.page-dashboard,
.home-dashboard,
.home-case,
.transfer-page-fill {
  background: var(--sc-canvas);
}

.dash-view {
  padding: var(--sc-page-pad);
  box-sizing: border-box;
  width: 100%;
}

.stage.page-sheet,
.page-canvas {
  flex: 1;
  min-height: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  border: 0;
  box-shadow: none;
  animation: none;
}

/* One full-width page shell */
.page-case {
  flex: 1;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: var(--sc-box-pad);
  gap: var(--sc-page-gap);
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  border: 1px solid var(--sc-box-line);
  border-radius: calc(var(--sc-box-radius) + 2px);
  background: var(--sc-box);
  min-height: calc(100vh - 72px - var(--sc-page-pad) * 2);
}

.page-case-head {
  padding: 0 0 var(--sc-page-gap);
  border-bottom: 1px solid var(--sc-box-line);
  margin-bottom: 0;
}
.page-case-kicker {
  margin: 0 0 6px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--dash-faint);
}
.page-case-title {
  margin: 0;
  font-size: clamp(1.35rem, 2.2vw, 1.85rem);
  font-weight: 800;
  letter-spacing: -0.03em;
}
.page-case-desc {
  margin: 8px 0 0;
  color: var(--dash-muted);
  font-size: 14px;
  line-height: 1.5;
  max-width: 72rem;
}

.page-case:has(.transfer-page-fill) {
  padding: var(--sc-box-pad);
  gap: var(--sc-page-gap);
  min-height: calc(100vh - 72px - var(--sc-page-pad) * 2);
}

.page-dashboard,
.home-dashboard,
.home-case {
  flex: 1;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  gap: var(--sc-page-gap);
}

.page-case.home-case,
.page-case.home-case.bento-home {
  padding: var(--sc-box-pad);
  border: 1px solid var(--sc-box-line);
  background: var(--sc-box);
}

html[data-density="airy"] .bento-home,
html[data-density="airy"] .home-case.bento-home {
  max-width: none;
  margin-inline: 0;
}

.bento-home {
  width: 100%;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
}

.bento-stage {
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
}

.transfer-page-fill {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  width: 100%;
}

.dash-top {
  background: var(--sc-canvas);
  border-bottom: 1px solid var(--sc-box-line);
  box-shadow: none;
}

/* Inner surfaces inside the page case */
.sc-box,
.ui-card,
.bento-card,
.transfer-main,
.transfer-side,
.settings-control-banner,
.settings-tab-card,
.wallet-asset-card,
.transfer-insight-card,
.transfer-form-card,
.page-tabs button,
.support-tabs button,
.settings-stat,
.settings-choice,
.card-tile-wrap,
.card-tile,
.page-callout,
.pz-panel,
.pz-explorer,
.hw-panel,
.form-card,
.panel,
.page-card {
  background: var(--sc-box-2);
  border: 1px solid var(--sc-box-line);
  border-radius: var(--sc-box-radius);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.ui-card,
.bento-card,
.transfer-main,
.transfer-side,
.settings-control-banner,
.card-tile-wrap,
.pz-panel,
.pz-explorer {
  padding: var(--sc-box-pad);
}

.ui-card-intro,
.ui-card-hero {
  padding: var(--sc-box-pad);
}

.page-case > .ui-card-hero {
  padding: 0;
  margin: 0 0 4px;
  border: 0;
  box-shadow: none;
  background: transparent;
}
.page-case > .ui-card-hero .page-hero-title,
.page-case > .ui-card-hero .page-hero-kicker {
  display: none;
}
.page-case > .ui-card-hero .page-hero {
  padding: 0 0 8px;
}
.page-case > .ui-card-intro {
  padding: 0;
  margin: 0 0 8px;
  border: 0;
  box-shadow: none;
  background: transparent;
}
.page-case > .ui-card-intro .page-lede {
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
  color: var(--dash-muted);
  max-width: 62ch;
}

.glass-card:hover,
.ui-card:hover,
.page-card:hover,
.bento-card:hover {
  transform: none;
  box-shadow: none;
  border-color: color-mix(in srgb, var(--dash-text) 14%, var(--sc-box-line));
}
html[data-anim~="hover"] .card-hover:hover {
  transform: translateY(-2px);
  box-shadow: var(--dash-shadow-lg);
}

.transfer-main,
.transfer-side {
  background: var(--sc-box-2);
}

.transfer-main::before {
  height: 2px;
  margin: calc(-1 * var(--sc-box-pad)) calc(-1 * var(--sc-box-pad)) var(--sc-box-pad);
  border-radius: var(--sc-box-radius) var(--sc-box-radius) 0 0;
}

.transfer-layout {
  gap: var(--sc-page-gap);
  width: 100%;
}

/* Settings — boxed sidebar studio */
.settings-studio {
  display: grid;
  grid-template-columns: minmax(200px, 228px) minmax(0, 1fr);
  gap: var(--sc-page-gap);
  align-items: start;
  width: 100%;
}

.settings-studio--inner {
  grid-template-columns: minmax(180px, 200px) minmax(0, 1fr);
  width: 100%;
}

.settings-studio-main {
  min-width: 0;
  width: 100%;
}

.settings-box-nav {
  display: flex;
  flex-direction: column;
  gap: 6px;
  position: sticky;
  top: 8px;
  z-index: 3;
}

.settings-box-nav--stack {
  max-height: calc(100vh - 120px);
  overflow: auto;
  padding-right: 2px;
}

.settings-box-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
  min-height: 52px;
  padding: 10px 12px;
  border: 1px solid var(--sc-box-line);
  border-radius: var(--sc-box-radius);
  background: var(--sc-box-2);
  color: var(--dash-text);
  text-align: left;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.settings-box-item:hover {
  border-color: color-mix(in srgb, var(--dash-accent) 35%, var(--sc-box-line));
}

.settings-box-item.is-active {
  border-color: color-mix(in srgb, var(--dash-accent) 50%, var(--sc-box-line));
  background: color-mix(in srgb, var(--dash-accent) 8%, var(--sc-box-2));
  box-shadow: inset 3px 0 0 var(--dash-accent);
}

.settings-box-ico {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid var(--sc-box-line);
  border-radius: 8px;
  font-size: 14px;
  background: var(--sc-canvas);
}

.settings-box-copy b {
  display: block;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
}

.settings-box-copy small {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  line-height: 1.35;
  color: var(--dash-muted);
}

.settings-box-nav-col {
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: sticky;
  top: 8px;
  z-index: 3;
}

.settings-box-nav-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.settings-box-nav-label {
  display: block;
  padding: 0 4px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--dash-muted);
}

.settings-studio--paged .settings-studio-main {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
}

.settings-page-panel {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  width: 100%;
}

/* Borderless settings sheet */
.sp-sheet {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
  min-width: 0;
}

.sp-section {
  width: 100%;
  padding: 20px 0 22px;
  border-bottom: 1px solid var(--sc-box-line);
}

.sp-section:first-child {
  padding-top: 4px;
}

.sp-section:last-child {
  border-bottom: 0;
  padding-bottom: 8px;
}

.sp-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.sp-section-titles h3 {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.3;
}

.sp-section-titles p {
  margin: 5px 0 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--dash-muted);
  max-width: 52rem;
}

.sp-section-body {
  width: 100%;
  min-width: 0;
}

.sp-subhead {
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 700;
}

.sp-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  padding-top: 0;
}

.sp-action-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.sp-field-row {
  margin-top: 14px;
}

.sp-toolbar {
  padding: 14px 0 16px;
  margin-bottom: 0;
  border-bottom: 1px solid var(--sc-box-line);
}

.sp-notice {
  margin: 0 0 12px;
  padding: 10px 12px;
  border-left: 3px solid var(--dash-accent, #2563eb);
  color: var(--sc-text-muted, rgba(255, 255, 255, 0.72));
  font-size: 0.875rem;
  line-height: 1.45;
}

.sp-kv-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid color-mix(in srgb, var(--sc-box-line) 75%, transparent);
}

.sp-kv-row:first-child {
  padding-top: 0;
}

.sp-kv-row:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.sp-kv-copy span {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--dash-muted);
  margin-bottom: 4px;
}

.sp-kv-copy b {
  font-size: 14px;
  word-break: break-all;
}

.sp-kv-inline {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px 20px;
  margin-bottom: 4px;
}

.sp-kv-inline .kv {
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: 0;
}

.sp-rows .list-row,
.sp-rows .list-row-static,
.sp-rows .ledger-row {
  border: 0;
  border-radius: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--sc-box-line) 75%, transparent);
  background: transparent;
  margin: 0;
}

.sp-rows .list-row:last-child,
.sp-rows .list-row-static:last-child,
.sp-rows .ledger-row:last-child {
  border-bottom: 0;
}

.sp-check-grid,
.sp-sheet .check-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr));
  gap: 0;
  width: 100%;
}

.sp-check-grid .check-cell,
.sp-sheet .check-grid .check-cell {
  min-height: 44px;
  padding: 10px 0;
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--sc-box-line) 60%, transparent);
  border-radius: 0;
  background: transparent;
}

.sp-check-grid .check-cell:hover,
.sp-sheet .check-grid .check-cell:hover {
  color: var(--dash-text);
  background: transparent;
}

.sp-choice-grid {
  margin-top: 0;
}

.sp-sheet .settings-choice {
  min-height: 56px;
  padding: 10px 12px;
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--sc-box-line) 70%, transparent);
  border-radius: 0;
  background: transparent;
}

.sp-sheet .settings-choice.on {
  background: color-mix(in srgb, var(--dash-accent) 6%, transparent);
  box-shadow: inset 3px 0 0 var(--dash-accent);
}

.sp-sheet .settings-choice:hover {
  background: color-mix(in srgb, var(--dash-accent) 4%, transparent);
}

.sp-photo-row {
  align-items: flex-start;
}

.sp-linked-pill {
  margin: 0 0 12px;
  font-size: 13px;
  color: var(--dash-muted);
}

.sp-wallet-menu .wallet-btn,
.sp-wallet-row {
  border: 0;
  border-radius: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--sc-box-line) 75%, transparent);
  background: transparent;
}

.sp-wallet-menu .wallet-btn:last-child {
  border-bottom: 0;
}

.settings-page-xlink {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 0 14px;
  margin-bottom: 2px;
  border-bottom: 1px solid var(--sc-box-line);
  background: transparent;
  border-radius: 0;
}

.settings-page-xlink span {
  font-size: 12px;
  color: var(--dash-muted);
}

.settings-page-head {
  padding-bottom: 14px;
  margin-bottom: 2px;
  border-bottom: 1px solid var(--sc-box-line);
}

.settings-page-head h2 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.02em;
}

.settings-page-head p {
  margin: 6px 0 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--dash-muted);
  max-width: 40rem;
}

/* Flat sidebar nav */
.settings-box-nav--flat .settings-box-item {
  min-height: 44px;
  padding: 8px 10px 8px 12px;
  border: 0;
  border-radius: 0;
  border-left: 3px solid transparent;
  background: transparent;
  box-shadow: none;
}

.settings-box-nav--flat .settings-box-item:hover {
  background: color-mix(in srgb, var(--dash-accent) 5%, transparent);
}

.settings-box-nav--flat .settings-box-item.is-active {
  border-left-color: var(--dash-accent);
  background: color-mix(in srgb, var(--dash-accent) 7%, transparent);
  box-shadow: none;
}

.settings-box-nav--flat .settings-box-ico {
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 0;
  background: transparent;
  font-size: 13px;
  opacity: 0.85;
}

.settings-box-nav--flat .settings-box-copy b {
  font-size: 13px;
}

.settings-box-nav--flat .settings-box-copy small {
  font-size: 10px;
}

.settings-control-banner--flat {
  width: 100%;
  margin: 0 0 var(--sc-page-gap);
  padding: 0 0 18px;
  border: 0;
  border-radius: 0;
  border-bottom: 1px solid var(--sc-box-line);
  background: transparent;
  box-shadow: none;
}

.settings-control-banner--flat .settings-stat {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.settings-control-banner--flat .settings-control-stats {
  gap: 16px 24px;
}

.settings-pane {
  width: 100%;
}

.settings-pane > .ui-card {
  display: none;
}

.settings-studio-main.sp-sheet,
.settings-pane .sp-sheet {
  flex: 1;
  min-height: 0;
}

.cp-page-panel {
  border: 0;
  border-radius: 0;
  background: transparent;
  min-width: 0;
  width: 100%;
}

.cp-page-panel .cp-section-inner {
  padding: 0;
}

.cp-global-bar,
.sp-toolbar.cp-global-bar {
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 14px 0 16px;
  margin-bottom: 0;
}

.cp-section-onebox {
  border: 0;
  border-radius: 0;
  background: transparent;
}

.cp-target-row {
  padding: 16px 0;
  border-bottom: 1px solid var(--sc-box-line);
}

.cp-target-row:last-child {
  border-bottom: 0;
}

.cp-preset-chip {
  border: 0;
  border-radius: 999px;
  background: color-mix(in srgb, var(--dash-accent) 8%, var(--sc-canvas));
  padding: 0 12px;
}

.cp-preset-chip.is-selected {
  background: color-mix(in srgb, var(--dash-accent) 18%, var(--sc-canvas));
}

.pz-field-compact,
.cp-field,
.pz-field {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.sp-sheet .net-grid {
  margin-top: 0;
}

.sp-sheet .field {
  margin-bottom: 12px;
}

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

@media (max-width: 900px) {
  .settings-control-banner--flat {
    flex-direction: column;
    align-items: flex-start;
  }

  .settings-control-banner--flat .settings-control-stats {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sp-section-head {
    flex-direction: column;
  }
}


.cp-global-bar-row {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.cp-global-label {
  flex: 0 0 88px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--dash-faint);
}

.cp-accent-compact {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
}

.cp-accent-compact .cp-accent-fx {
  margin-left: 0;
  min-width: 140px;
}

/* Compact section — one box per category */
.cp-section-onebox {
  border: 1px solid var(--sc-box-line);
  border-radius: var(--sc-box-radius);
  background: var(--sc-box-2);
  overflow: hidden;
}

.cp-section-headbar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--sc-box-line);
  background: color-mix(in srgb, var(--dash-primary) 4%, var(--sc-box-2));
}

.cp-section-headbar b {
  display: block;
  font-size: 14px;
}

.cp-section-headbar small {
  display: block;
  font-size: 11px;
  color: var(--dash-muted);
  line-height: 1.35;
}

.cp-section-inner {
  padding: 10px 12px 12px;
}

.cp-target-stack {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.cp-target-row {
  display: grid;
  grid-template-columns: minmax(140px, 180px) minmax(0, 1fr);
  gap: 8px 12px;
  align-items: start;
  padding: 10px 0;
  border-bottom: 1px solid color-mix(in srgb, var(--sc-box-line) 80%, transparent);
}

.cp-target-row:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.cp-target-meta b {
  display: block;
  font-size: 12px;
  font-weight: 700;
}

.cp-target-meta small {
  display: block;
  margin-top: 2px;
  font-size: 10px;
  line-height: 1.35;
  color: var(--dash-muted);
}

.cp-target-row .cp-preset-strip {
  grid-column: 1 / -1;
}

.cp-target-controls {
  grid-column: 1 / -1;
}

.cp-target-controls .pz-select-grid,
.cp-target-controls > .pz-select-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 8px;
}

.pz-field-compact .pz-field-copy b {
  font-size: 11px;
}

.pz-field-compact .pz-field-copy small {
  font-size: 10px;
  line-height: 1.3;
}

.pz-field-compact .pz-select-wrap select,
.pz-field-compact .pz-select {
  min-height: 36px;
  height: 36px;
  font-size: 12px;
  border-radius: 8px;
}

/* Inline preset chips */
.cp-preset-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.cp-preset-chip {
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid var(--sc-box-line);
  border-radius: 6px;
  background: var(--sc-canvas);
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  transition: border-color 0.12s ease, background 0.12s ease;
}

.cp-preset-chip:hover {
  border-color: color-mix(in srgb, var(--dash-accent) 40%, var(--sc-box-line));
}

.cp-preset-chip.is-selected {
  border-color: color-mix(in srgb, var(--dash-accent) 55%, var(--sc-box-line));
  background: color-mix(in srgb, var(--dash-accent) 10%, var(--sc-canvas));
}

/* FX studio compact */
.cp-fx-studio {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.cp-fx-topbar {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--sc-box-line);
  margin-bottom: 4px;
}

.cp-fx-toprow {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.cp-fx-toplabel {
  flex: 0 0 72px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--dash-faint);
}

.cp-fx-tools {
  gap: 8px;
}

.cp-fx-tools .cp-input {
  width: 120px;
  min-height: 32px;
}

.cp-fx-group {
  border-top: 1px solid color-mix(in srgb, var(--sc-box-line) 70%, transparent);
  padding-top: 8px;
}

.cp-fx-group-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 6px;
}

.cp-fx-group-head b {
  font-size: 12px;
}

.cp-fx-group-head small {
  font-size: 10px;
  color: var(--dash-muted);
}

.cp-fx-list--compact .cp-fx-row {
  padding: 6px 8px;
  gap: 8px;
}

.cp-board-sections {
  display: flex;
  flex-direction: column;
  gap: var(--sc-page-gap);
}

.cp-board-section {
  scroll-margin-top: 16px;
}

.cp-target-controls .cp-profile-extras {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

@media (max-width: 900px) {
  .settings-studio,
  .settings-studio--inner {
    grid-template-columns: 1fr;
  }

  .settings-box-nav,
  .settings-box-nav--stack {
    position: static;
    max-height: none;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cp-target-row {
    grid-template-columns: 1fr;
  }
}


.settings-pane {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
  min-width: 0;
}

.settings-pane > .ui-card,
.settings-pane > .personalize-studio {
  width: 100%;
}

.settings-control-banner {
  width: 100%;
  margin: 0;
  background: color-mix(in srgb, var(--dash-primary) 5%, var(--sc-box-2));
}

.personalize-studio,
.personalize-board {
  display: flex;
  flex-direction: column;
  gap: var(--sc-page-gap);
  width: 100%;
}

.personalize-extras {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sc-page-gap);
  width: 100%;
}

.personalize-extras > .ui-card.personalize-wide,
.personalize-studio > .ui-card.personalize-wide {
  grid-column: 1 / -1;
  width: 100%;
}

.pz-explorer {
  display: grid;
  grid-template-columns: minmax(180px, 240px) minmax(220px, 1fr) minmax(0, 1.4fr);
  gap: var(--sc-page-gap);
  align-items: end;
  width: 100%;
}

.pz-drop {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.pz-drop > span {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--dash-faint);
}

.pz-drop select,
.pz-select-wrap select {
  width: 100%;
  min-height: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--sc-canvas);
  border: 1px solid var(--sc-box-line);
  padding: 0 14px;
  font-weight: 600;
}

.pz-explorer-desc {
  margin: 0;
  color: var(--dash-muted);
  font-size: 13px;
  line-height: 1.45;
  align-self: center;
}

.pz-panel {
  width: 100%;
  padding: var(--sc-box-pad);
}

.pz-panel-title {
  margin: 0 0 var(--sc-page-gap);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--dash-faint);
}

.pz-select-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sc-page-gap);
  width: 100%;
}

.pz-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--sc-box-line);
  border-radius: calc(var(--sc-box-radius) - 4px);
  background: var(--sc-canvas);
}

.pz-field-copy b {
  display: block;
  font-size: 14px;
}

.pz-field-copy small {
  display: block;
  margin-top: 2px;
  color: var(--dash-muted);
  font-size: 12px;
  line-height: 1.35;
}

.pz-select-wrap { display: block; width: 100%; }

/* Full-width grids */
.page-grid-2,
.page-grid-2-wide,
.page-grid-2-equal,
.page-workbench,
.home-studio,
.page-magazine,
.page-river,
.home-island,
.wallet-grid,
.settings-info-grid,
.transfer-insight-grid,
.wallet-asset-grid,
.page-tab-panel,
.bento-home,
.bento-stage,
.bento-rail,
.fx-list,
.fx-studio-masters {
  gap: var(--sc-page-gap);
  width: 100%;
}

.page-grid-2-wide {
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
}

.page-section {
  padding: 0;
  border: 0;
  background: transparent;
}

.page-tabs {
  margin-top: 0;
  gap: var(--sc-page-gap);
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

.dash-body input:not([type="radio"]):not([type="checkbox"]):not([type="range"]),
.dash-body select,
.dash-body textarea {
  background: var(--sc-canvas);
  border-color: var(--sc-box-line);
}

.card-tile-wrap { padding: 0; overflow: hidden; }

@media (min-width: 960px) {
  .transfer-layout.has-side {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
    min-height: calc(100vh - 72px - var(--sc-page-pad) * 2 - 24px);
    align-items: start;
  }

  .transfer-main,
  .transfer-side {
    min-height: 0;
  }

  .transfer-page--swap .swap-exchange-case {
    max-width: min(100%, 540px);
  }
}

html[data-density="airy"] {
  --sc-box-pad: 22px;
  --sc-page-gap: 14px;
  --sc-page-pad: 14px;
}

html[data-density="compact"] {
  --sc-box-pad: 14px;
  --sc-page-gap: 8px;
  --sc-page-pad: 8px;
  --sc-box-radius: 14px;
}

html[data-density="board"] {
  --sc-box-pad: 12px;
  --sc-page-gap: 8px;
  --sc-page-pad: 8px;
  --sc-box-radius: 12px;
}

/* Personalize category controller */
.pz-category-bar {
  display: grid;
  grid-template-columns: minmax(240px, 320px) minmax(0, 1fr);
  gap: var(--sc-page-gap);
  align-items: end;
  width: 100%;
  padding: var(--sc-box-pad);
  border: 1px solid var(--sc-box-line);
  border-radius: var(--sc-box-radius);
  background: color-mix(in srgb, var(--dash-primary) 4%, var(--sc-canvas));
}
.pz-drop-main select {
  font-size: 15px;
  font-weight: 700;
}
.pz-category-desc {
  margin: 0;
  color: var(--dash-muted);
  font-size: 14px;
  line-height: 1.5;
  align-self: center;
}
.pz-category-body {
  width: 100%;
  min-width: 0;
}
.pz-cat-panel {
  display: none;
  flex-direction: column;
  gap: var(--sc-page-gap);
  animation: pzCatIn 0.35s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.pz-cat-panel.is-active {
  display: flex;
}
@keyframes pzCatIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}
.pz-panel-lede {
  margin: 0 0 var(--sc-page-gap);
}
.personalize-extras--stack {
  display: flex;
  flex-direction: column;
  gap: var(--sc-page-gap);
}
.pz-advanced-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: var(--sc-page-gap);
}

/* Control desk — boxed professional layout */
/* Control desk — full built-in board */
.cp-board {
  display: flex;
  flex-direction: column;
  gap: calc(var(--sc-page-gap) + 6px);
  width: 100%;
}

.cp-board-intro b {
  display: block;
  font-size: 15px;
  margin-bottom: 4px;
}

.cp-board-intro small {
  font-size: 13px;
  line-height: 1.5;
  color: var(--dash-muted);
}

.cp-board-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  position: sticky;
  top: 8px;
  z-index: 4;
}

.cp-board-nav-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 6px 12px;
  border: 1px solid var(--sc-box-line);
  border-radius: 8px;
  background: var(--sc-canvas);
  color: var(--dash-text);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.cp-board-nav-btn:hover {
  border-color: color-mix(in srgb, var(--dash-accent) 40%, var(--sc-box-line));
}

.cp-board-nav-btn.is-active {
  border-color: color-mix(in srgb, var(--dash-accent) 60%, var(--sc-box-line));
  background: color-mix(in srgb, var(--dash-accent) 10%, var(--sc-canvas));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--dash-accent) 25%, transparent);
}

.cp-board-nav-ico {
  font-size: 14px;
  opacity: 0.85;
}

.cp-board-sections {
  display: flex;
  flex-direction: column;
  gap: calc(var(--sc-page-gap) + 8px);
}

.cp-board-section {
  scroll-margin-top: 72px;
}

.cp-section-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: calc(var(--sc-page-gap) + 4px);
}

.cp-section-ico {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  font-size: 18px;
  background: color-mix(in srgb, var(--dash-accent) 12%, var(--sc-canvas));
  border: 1px solid color-mix(in srgb, var(--dash-accent) 25%, var(--sc-box-line));
}

.cp-section-head b {
  display: block;
  font-size: 15px;
}

.cp-section-head small {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  color: var(--dash-muted);
  line-height: 1.45;
}

.cp-section-body {
  display: flex;
  flex-direction: column;
  gap: calc(var(--sc-page-gap) + 4px);
}

.cp-desk-full {
  display: flex;
  flex-direction: column;
  gap: calc(var(--sc-page-gap) + 6px);
}

.cp-target-block {
  display: flex;
  flex-direction: column;
  gap: calc(var(--sc-page-gap) + 4px);
  padding-bottom: calc(var(--sc-page-gap) + 4px);
  border-bottom: 1px solid color-mix(in srgb, var(--sc-box-line) 70%, transparent);
}

.cp-target-block:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.cp-desk-presets {
  border-color: color-mix(in srgb, var(--dash-accent) 30%, var(--sc-box-line));
}

.cp-fx-group {
  scroll-margin-top: 72px;
}

.cp-fx-actions-box {
  margin-top: 4px;
}

/* Control desk — single unified console (legacy) */
.cp-console {
  display: flex;
  flex-direction: column;
  gap: calc(var(--sc-page-gap) + 4px);
  width: 100%;
}

.cp-console-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
  gap: var(--sc-page-gap);
  align-items: end;
}

.cp-console-area {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.cp-console-area > span,
.cp-console-feature > span,
.cp-accent-hex > span,
.cp-accent-fx > span {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--dash-faint);
}

.cp-console-desc {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--dash-muted);
  align-self: center;
}

.cp-console-workspace,
.cp-desk-body {
  display: flex;
  flex-direction: column;
  gap: calc(var(--sc-page-gap) + 4px);
  width: 100%;
  min-width: 0;
}

.cp-accent-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
}

.cp-color-wheel {
  position: relative;
  flex: 0 0 auto;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  cursor: pointer;
  transition: box-shadow 0.2s ease, transform 0.12s ease;
}

.cp-color-wheel:hover {
  transform: scale(1.04);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--dash-accent) 35%, transparent),
    0 8px 24px color-mix(in srgb, var(--dash-accent) 18%, transparent);
}

.cp-color-wheel.is-active {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--dash-accent) 55%, transparent),
    0 0 20px color-mix(in srgb, var(--dash-accent) 25%, transparent);
}

.cp-color-wheel-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid color-mix(in srgb, var(--dash-accent) 40%, var(--sc-box-line));
  background: conic-gradient(from 0deg, #ef4444, #f59e0b, #22c55e, #06b6d4, #3b82f6, #8b5cf6, #ef4444);
  opacity: 0.35;
}

.cp-color-wheel-fill {
  position: absolute;
  inset: 6px;
  border-radius: 50%;
  border: 2px solid color-mix(in srgb, #fff 25%, var(--sc-box-line));
  box-shadow: inset 0 0 8px color-mix(in srgb, #000 15%, transparent);
}

.cp-color-wheel input[type="color"] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
  border: 0;
  padding: 0;
}

.cp-accent-dots {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.cp-accent-dot {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 2px solid color-mix(in srgb, #fff 20%, var(--sc-box-line));
  background: var(--dot-color, #2563eb);
  cursor: pointer;
  transition: transform 0.12s ease, box-shadow 0.15s ease;
}

.cp-accent-dot:hover {
  transform: scale(1.08);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--dot-color) 40%, transparent);
}

.cp-accent-dot.is-active {
  transform: scale(1.12);
  box-shadow: 0 0 0 2px var(--dot-color), 0 0 14px color-mix(in srgb, var(--dot-color) 45%, transparent);
}

.cp-accent-hex {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 100px;
}

.cp-accent-fx {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 180px;
  margin-left: auto;
}

.cp-desk-target .cp-console-feature {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.cp-desk-target .cp-select {
  min-height: 44px;
  font-size: 14px;
}

.cp-fx-master .cp-seg {
  margin-top: 4px;
}

.personalize-studio--desk {
  gap: calc(var(--sc-page-gap) + 4px);
}

.cp-desk {
  display: flex;
  flex-direction: column;
  gap: calc(var(--sc-page-gap) + 4px);
  width: 100%;
}

.cp-box {
  border: 1px solid var(--sc-box-line);
  border-radius: var(--sc-box-radius);
  background: color-mix(in srgb, var(--dash-primary) 3%, var(--sc-canvas));
  padding: var(--sc-box-pad);
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 6%, transparent);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.cp-box:hover {
  border-color: color-mix(in srgb, var(--dash-accent) 28%, var(--sc-box-line));
}

.cp-box-head {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 12px;
}

.cp-box-head b {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--dash-text);
}

.cp-box-head small {
  font-size: 12px;
  color: var(--dash-muted);
  line-height: 1.4;
}

.cp-text-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 8px;
}

.cp-text-btn {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  min-height: 52px;
  padding: 10px 12px;
  border: 1px solid var(--sc-box-line);
  border-radius: 10px;
  background: var(--sc-canvas);
  color: var(--dash-text);
  text-align: left;
  cursor: pointer;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, transform 0.12s ease;
}

.cp-text-btn:hover {
  border-color: color-mix(in srgb, var(--dash-accent) 45%, var(--sc-box-line));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--dash-accent) 18%, transparent),
    0 8px 24px color-mix(in srgb, var(--dash-accent) 10%, transparent);
}

.cp-text-btn.is-active {
  border-color: color-mix(in srgb, var(--dash-accent) 65%, var(--sc-box-line));
  background: color-mix(in srgb, var(--dash-accent) 10%, var(--sc-canvas));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--dash-accent) 35%, transparent),
    inset 0 0 20px color-mix(in srgb, var(--dash-accent) 8%, transparent);
}

.cp-text-btn-label {
  font-size: 13px;
  font-weight: 700;
}

.cp-text-btn-hint {
  font-size: 11px;
  color: var(--dash-muted);
  line-height: 1.35;
}

.cp-feature-panels {
  display: flex;
  flex-direction: column;
  gap: calc(var(--sc-page-gap) + 4px);
}

.cp-feature-panel {
  display: none;
  flex-direction: column;
  gap: calc(var(--sc-page-gap) + 4px);
  animation: cpPanelIn 0.28s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.cp-feature-panel.is-active {
  display: flex;
}

@keyframes cpPanelIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

.cp-desc-box {
  border-left: 3px solid color-mix(in srgb, var(--dash-accent) 55%, transparent);
}

.cp-desc-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.cp-desc-head h4 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
}

.cp-prof-badge,
.cp-preset-tier {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border-radius: 6px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border: 1px solid color-mix(in srgb, var(--dash-accent) 35%, var(--sc-box-line));
  background: color-mix(in srgb, var(--dash-accent) 12%, transparent);
  color: var(--dash-accent);
}

.cp-desc-body,
.cp-desc-applies {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
  color: var(--dash-muted);
}

.cp-desc-applies {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--sc-box-line);
}

.cp-desc-applies b {
  color: var(--dash-text);
}

.cp-preset-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 10px;
}

.cp-preset-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 12px;
  border: 1px solid var(--sc-box-line);
  border-radius: 12px;
  background: var(--sc-canvas);
  text-align: left;
  cursor: pointer;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.12s ease;
}

.cp-preset-card:hover {
  border-color: color-mix(in srgb, var(--dash-accent) 40%, var(--sc-box-line));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--dash-accent) 15%, transparent);
  transform: translateY(-1px);
}

.cp-preset-card.is-selected {
  border-color: color-mix(in srgb, var(--dash-accent) 70%, var(--sc-box-line));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--dash-accent) 40%, transparent),
    0 12px 32px color-mix(in srgb, var(--dash-accent) 12%, transparent);
}

.cp-preset-card b {
  font-size: 14px;
}

.cp-preset-card small,
.cp-preset-applies {
  font-size: 11px;
  line-height: 1.45;
  color: var(--dash-muted);
}

.cp-preset-applies {
  margin-top: 2px;
  font-weight: 600;
}

.cp-control-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 12px;
}

.cp-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--sc-box-line);
  border-radius: 10px;
  background: color-mix(in srgb, var(--dash-primary) 2%, var(--sc-canvas));
}

.cp-field-head b {
  display: block;
  font-size: 13px;
  font-weight: 700;
}

.cp-field-head small {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  color: var(--dash-muted);
  line-height: 1.4;
}

.cp-controls-box .pz-field,
.cp-controls-box .cp-field {
  min-width: 0;
}

.cp-controls-box .pz-select,
.cp-select,
.cp-input {
  width: 100%;
  min-height: 40px;
  border-radius: 8px;
  border: 1px solid var(--sc-box-line);
  background: var(--sc-canvas);
  padding: 0 12px;
  font-weight: 600;
  font-size: 13px;
}

.cp-seg {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
}

.cp-seg-btn {
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--sc-box-line);
  border-radius: 8px;
  background: var(--sc-canvas);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.cp-seg-btn:hover {
  border-color: color-mix(in srgb, var(--dash-accent) 40%, var(--sc-box-line));
}

.cp-seg-btn.is-active {
  border-color: color-mix(in srgb, var(--dash-accent) 65%, var(--sc-box-line));
  background: color-mix(in srgb, var(--dash-accent) 12%, var(--sc-canvas));
  box-shadow: inset 0 0 12px color-mix(in srgb, var(--dash-accent) 10%, transparent);
}

.cp-seg-sm .cp-seg-btn {
  min-height: 32px;
  padding: 0 10px;
  font-size: 11px;
}

.cp-fx-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 12px;
}

.cp-fx-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--sc-box-line);
  border-radius: 10px;
  background: var(--sc-canvas);
}

.cp-fx-row-head {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
}

.cp-fx-row-head b {
  display: block;
  font-size: 13px;
}

.cp-fx-row-head small {
  display: block;
  font-size: 11px;
  color: var(--dash-muted);
  line-height: 1.35;
}

.cp-fx-icon {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: color-mix(in srgb, var(--dash-accent) 10%, transparent);
}

.cp-fx-scope {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 120px;
}

.cp-fx-scope span {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--dash-faint);
}

.cp-fx-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding-top: 10px;
  border-top: 1px solid var(--sc-box-line);
}

.cp-inline-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 160px;
}

.cp-inline-field span {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--dash-faint);
}

.cp-action-btn {
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid color-mix(in srgb, var(--dash-accent) 35%, var(--sc-box-line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--dash-accent) 8%, var(--sc-canvas));
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.cp-action-btn:hover {
  border-color: color-mix(in srgb, var(--dash-accent) 55%, var(--sc-box-line));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--dash-accent) 20%, transparent);
}

.cp-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.cp-status {
  margin-top: 10px;
  font-size: 12px;
  color: var(--dash-muted);
}

.cp-status.flash {
  color: var(--dash-accent);
}

.cp-settings-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  width: 100%;
  margin-bottom: var(--sc-page-gap);
  padding: var(--sc-box-pad);
  border: 1px solid color-mix(in srgb, var(--dash-accent) 25%, var(--sc-box-line));
  border-radius: var(--sc-box-radius);
  background: color-mix(in srgb, var(--dash-accent) 6%, var(--sc-canvas));
}

.cp-settings-strip b {
  display: block;
  font-size: 13px;
}

.cp-settings-strip small {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  color: var(--dash-muted);
}

.cp-profile-extras {
  display: flex;
  flex-direction: column;
  gap: var(--sc-page-gap);
  grid-column: 1 / -1;
}

.cp-desk-fx .cp-control-grid {
  grid-template-columns: 1fr;
}

html[data-alert-layout="list"] .check-grid {
  grid-template-columns: 1fr;
}

/* Settings flat UI — ignore saved layout prefs inside settings pages */
html[data-settings-ui="flat"] .settings-pane .sp-check-grid,
html[data-settings-ui="flat"] .settings-pane .check-grid {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)) !important;
}

html[data-settings-ui="flat"] .settings-pane .sp-rows .list-row,
html[data-settings-ui="flat"] .settings-pane .sp-rows .list-row-static {
  min-height: 48px;
  padding: 12px 0 !important;
}

html[data-settings-ui="flat"] .settings-pane .settings-choice {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

html[data-settings-ui="flat"] .settings-pane .settings-choice.on {
  background: color-mix(in srgb, var(--dash-accent) 6%, transparent) !important;
  box-shadow: inset 3px 0 0 var(--dash-accent) !important;
}

html[data-settings-ui="flat"] .settings-pane .ui-card,
html[data-settings-ui="flat"] .settings-pane .glass-card {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

html[data-session-density="compact"] .list-card .list-row {
  padding-top: 8px;
  padding-bottom: 8px;
}

html[data-settings-ui="flat"] .settings-pane .list-row,
html[data-settings-ui="flat"] .settings-pane .list-row-static {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}

html[data-api-density="compact"] .ledger-table .list-row {
  padding-top: 6px;
  padding-bottom: 6px;
}

html[data-settings-ui="flat"] .settings-pane .sp-rows .list-row,
html[data-settings-ui="flat"] .settings-pane .sp-rows .list-row-static {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}

@media (max-width: 900px) {
  .cp-console-toolbar {
    grid-template-columns: 1fr;
  }

  .cp-accent-fx {
    margin-left: 0;
    width: 100%;
  }

  .cp-fx-row {
    grid-template-columns: 1fr;
  }

  .cp-control-grid {
    grid-template-columns: 1fr;
  }

  .cp-text-grid {
    grid-template-columns: 1fr 1fr;
  }
}

/* Swap hub between cards */
.swap-pair-stack {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
}
.swap-hub-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 72px;
  margin: -12px 0;
  z-index: 2;
}
.swap-hub-bridge {
  position: absolute;
  left: 50%;
  width: 2px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, color-mix(in srgb, var(--transfer-accent, #7c3aed) 35%, transparent), color-mix(in srgb, var(--transfer-accent, #7c3aed) 65%, transparent));
  opacity: 0.7;
}
.swap-hub-bridge--top { top: 0; height: calc(50% - 28px); }
.swap-hub-bridge--bottom { bottom: 0; height: calc(50% - 28px); }
.swap-hub {
  position: relative;
  width: 56px;
  height: 56px;
  border-radius: 999px;
  border: 2px solid color-mix(in srgb, var(--transfer-accent, #7c3aed) 45%, var(--dash-line));
  background: color-mix(in srgb, var(--transfer-accent, #7c3aed) 12%, var(--dash-panel));
  color: var(--transfer-accent, #7c3aed);
  display: grid;
  place-items: center;
  cursor: pointer;
  box-shadow: 0 8px 24px color-mix(in srgb, var(--transfer-accent, #7c3aed) 25%, transparent);
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s ease;
}
.swap-hub:hover {
  transform: scale(1.06);
  box-shadow: 0 12px 32px color-mix(in srgb, var(--transfer-accent, #7c3aed) 35%, transparent);
}
.swap-hub--spin { animation: swapHubSpin 0.52s cubic-bezier(0.16, 1, 0.3, 1); }
@keyframes swapHubSpin {
  0% { transform: rotate(0deg) scale(1); }
  45% { transform: rotate(180deg) scale(1.12); }
  100% { transform: rotate(360deg) scale(1); }
}
.swap-hub-glow {
  position: absolute;
  inset: -8px;
  border-radius: inherit;
  background: radial-gradient(circle, color-mix(in srgb, var(--transfer-accent, #7c3aed) 30%, transparent), transparent 70%);
  animation: swapHubPulse 2.2s ease-in-out infinite;
  pointer-events: none;
}
@keyframes swapHubPulse {
  0%, 100% { opacity: 0.45; transform: scale(0.92); }
  50% { opacity: 1; transform: scale(1.05); }
}
.swap-hub-ring {
  position: absolute;
  inset: 4px;
  border-radius: inherit;
  border: 1px dashed color-mix(in srgb, var(--transfer-accent, #7c3aed) 35%, transparent);
  animation: swapHubRing 3s linear infinite;
  pointer-events: none;
}
@keyframes swapHubRing {
  to { transform: rotate(360deg); }
}
.swap-hub-logo {
  position: relative;
  z-index: 1;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
}
.swap-hub-logo svg {
  width: 22px;
  height: 22px;
}
html[data-swap-hub="off"] .swap-hub-wrap { display: none; }

/* Swap confirm studio */
.swap-confirm-studio {
  display: flex;
  flex-direction: column;
  gap: var(--u3);
}
.swap-confirm-head h3 {
  margin: 6px 0 0;
  font-size: 1.35rem;
  letter-spacing: -0.03em;
}
.swap-confirm-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding: 6px;
  border-radius: 14px;
  border: 1px solid var(--dash-line);
  background: var(--sc-canvas);
}
.swap-confirm-tabs button {
  min-height: 44px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.swap-confirm-tabs button.on {
  background: color-mix(in srgb, var(--transfer-accent, #7c3aed) 12%, var(--dash-panel));
  border-color: color-mix(in srgb, var(--transfer-accent, #7c3aed) 35%, var(--dash-line));
  color: var(--transfer-accent, #7c3aed);
}
.swap-confirm-panels {
  position: relative;
  min-height: 120px;
}
.swap-confirm-panel {
  display: none;
  animation: transferStepIn 0.38s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.swap-confirm-panel.is-active {
  display: block;
}
.swap-auth-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 18px;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--transfer-accent, #7c3aed) 20%, var(--dash-line));
  background: color-mix(in srgb, var(--transfer-accent, #7c3aed) 4%, var(--dash-panel));
}
.swap-auth-submit {
  margin-top: 4px;
}
.swap-next-hint {
  animation: transferReviewIn 0.45s ease both;
}
html[data-transfer-style="wide"] .swap-flow-grid {
  grid-template-columns: 1fr;
}
html[data-search-style="box"] .dash-search {
  border-radius: 12px;
}
html[data-search-style="minimal"] .dash-search {
  border-radius: 8px;
  opacity: 0.92;
}
html[data-activity-density="compact"] .ledger-row,
html[data-activity-density="compact"] .list-row {
  min-height: 48px;
}
html[data-activity-density="dense"] .ledger-row,
html[data-activity-density="dense"] .list-row {
  min-height: 40px;
  font-size: 13px;
}
html[data-card-density="compact"] .card-face {
  transform: scale(0.98);
}
html[data-list-style="cards"] .asset-row-pro {
  border-radius: 14px;
  margin-bottom: 8px;
}

@media (max-width: 1200px) {
  .settings-tab-grid.settings-tab-full {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

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

  .personalize-extras {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  :root {
    --sc-page-pad: 8px;
    --sc-box-pad: 14px;
  }

  .bento-home,
  .bento-stage {
    grid-template-columns: 1fr;
  }

  .page-grid-2,
  .page-grid-2-wide,
  .page-grid-2-equal {
    grid-template-columns: 1fr;
  }

  .settings-tab-grid.settings-tab-full {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pz-explorer {
    grid-template-columns: 1fr;
  }

  .pz-category-bar {
    grid-template-columns: 1fr;
  }

  .pz-select-grid {
    grid-template-columns: 1fr;
  }
}

/* ═══ Transfer pages v2 — modern studio layout ═══ */
.transfer-page--v2 {
  display: flex;
  flex-direction: column;
  gap: var(--sc-page-gap);
  width: 100%;
  animation: transferPageIn 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes transferPageIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}

.transfer-tabnav {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  width: 100%;
  padding: 0;
  border-bottom: 1px solid var(--sc-box-line);
}

.transfer-tabnav-item {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  padding: 8px 10px;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--dash-muted);
  cursor: pointer;
  transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.transfer-tabnav-item:hover {
  color: var(--dash-text);
  background: color-mix(in srgb, var(--transfer-accent, var(--dash-accent)) 4%, transparent);
}

.transfer-tabnav-item.is-active {
  color: var(--transfer-accent, var(--dash-accent));
  border-bottom-color: var(--transfer-accent, var(--dash-accent));
  background: color-mix(in srgb, var(--transfer-accent, var(--dash-accent)) 6%, transparent);
}

.transfer-tabnav-ico {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  flex: none;
}

.transfer-tabnav-ico svg {
  width: 18px;
  height: 18px;
}

.transfer-tabnav-copy b {
  font-size: 13px;
  font-weight: 700;
}

.transfer-main.transfer-main--v2,
html[data-theme="dark"] .transfer-main.transfer-main--v2,
html[data-theme="light"] .transfer-main.transfer-main--v2 {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
  min-width: 0;
  overflow: visible;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.transfer-side.transfer-side--v2 {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
  min-width: 0;
  overflow: visible;
}

.transfer-main--v2::before {
  display: none;
}

.transfer-head.transfer-head--v2 {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  flex: none;
  padding-bottom: 14px;
  margin-bottom: 4px;
  border-bottom: 1px solid var(--sc-box-line);
  background: transparent;
}

.transfer-body--v2 {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
  min-width: 0;
}

.transfer-section {
  padding: 18px 0;
  border-bottom: 1px solid color-mix(in srgb, var(--sc-box-line) 80%, transparent);
}

.transfer-section:last-child {
  border-bottom: 0;
}

.transfer-section--flat {
  padding-top: 0;
}

.transfer-section--inset {
  margin-top: 8px;
  padding: 16px 0 0;
  border-bottom: 0;
}

.transfer-section-head h3 {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.transfer-section-head p {
  margin: 5px 0 0;
  font-size: 13px;
  color: var(--dash-muted);
  line-height: 1.45;
}

.transfer-section-body {
  margin-top: 12px;
}

.transfer-step-panel--in {
  animation: transferStepIn 0.42s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes transferStepIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}

.transfer-input--hero {
  min-height: 48px;
  font-size: 15px;
}

.transfer-input--mono {
  font-family: ui-monospace, monospace;
  font-size: 13px;
}

.transfer-side--v2 {
  padding-left: var(--sc-page-gap);
  border-left: 1px solid var(--sc-box-line);
}

.transfer-side--v2 .transfer-side-head {
  padding-bottom: 12px;
  border-bottom: 1px solid var(--sc-box-line);
}

/* Swap — ChangeNOW-style exchange widget */
.transfer-page--swap .transfer-layout {
  min-width: 0;
  align-items: start;
}

.transfer-page--swap .transfer-body--v2 {
  flex: none;
  width: 100%;
  min-width: 0;
  padding-top: 4px;
}

.transfer-page--swap .swap-exchange {
  flex: none;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  display: block;
}

.transfer-page--swap .swap-exchange-case {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  isolation: isolate;
}

.transfer-page--swap .transfer-insight-grid {
  margin-bottom: var(--sc-page-gap);
  width: 100%;
}

.swap-balance-chip {
  margin-top: 10px;
  padding: 10px 12px;
  width: 100%;
  box-sizing: border-box;
}

.swap-balance-chip .coin {
  width: 32px;
  height: 32px;
}

.swap-balance-chip b {
  font-size: 0.95rem;
}

.swap-balance-chip small {
  font-size: 12px;
}

.swap-exchange {
  width: 100%;
  min-width: 0;
}

.swap-exchange-case {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  border: 1px solid var(--sc-box-line);
  border-radius: var(--sc-box-radius);
  background: var(--sc-box-2);
  overflow: hidden;
  box-sizing: border-box;
}

.swap-exchange-widget {
  position: static;
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
  min-width: 0;
  max-width: none;
  margin: 0;
}

.swap-exchange-stack {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.swap-exchange-card {
  padding: 16px 18px;
  border: 0;
  border-radius: 0;
  background: transparent;
  transition: background 0.2s ease;
  min-width: 0;
  box-sizing: border-box;
}

.swap-exchange-card--from {
  padding-bottom: 14px;
  border-bottom: 0;
}

.swap-exchange-card--to {
  padding-top: 14px;
  border-top: 0;
  background: color-mix(in srgb, var(--transfer-accent, #7c3aed) 4%, transparent);
}

.swap-exchange-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.swap-exchange-row {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.swap-exchange-amount {
  flex: 1 1 0;
  min-width: 0;
  width: 0;
  min-height: 48px;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: clamp(1.35rem, 2.8vw, 1.85rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--dash-text);
}

.swap-exchange-amount:focus {
  outline: none;
}

.swap-exchange-amount--out {
  color: var(--transfer-accent, #7c3aed);
}

.swap-exchange-meta {
  margin: 8px 0 0;
  font-size: 12px;
  color: var(--dash-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.swap-exchange-flip-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: none;
  height: 44px;
  margin: 0;
  padding: 0;
  position: relative;
  z-index: 2;
  background: var(--sc-box-2);
  border-top: 1px solid color-mix(in srgb, var(--sc-box-line) 82%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--sc-box-line) 82%, transparent);
}

.swap-exchange-flip {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 2px solid color-mix(in srgb, var(--transfer-accent, #7c3aed) 45%, var(--sc-box-line));
  background: var(--sc-box-2);
  color: var(--transfer-accent, #7c3aed);
  display: grid;
  place-items: center;
  cursor: pointer;
  box-shadow: 0 4px 14px color-mix(in srgb, var(--transfer-accent, #7c3aed) 16%, transparent);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  flex: none;
}

.swap-exchange-flip:hover {
  transform: scale(1.06);
  box-shadow: 0 12px 28px color-mix(in srgb, var(--transfer-accent, #7c3aed) 32%, transparent);
}

.swap-exchange-flip--spin {
  animation: swapFlipSpin 0.52s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes swapFlipSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(180deg); }
}

.swap-exchange-flip-ico svg {
  width: 20px;
  height: 20px;
}

.swap-token-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 1 auto;
  width: auto;
  max-width: min(38%, 156px);
  min-width: 0;
  min-height: 48px;
  padding: 6px 10px 6px 8px;
  border: 1px solid var(--sc-box-line);
  border-radius: 12px;
  background: var(--sc-canvas);
  color: inherit;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
  box-sizing: border-box;
}

.swap-token-btn:hover,
.swap-token-btn.is-open {
  border-color: color-mix(in srgb, var(--transfer-accent, #7c3aed) 40%, var(--sc-box-line));
  background: color-mix(in srgb, var(--transfer-accent, #7c3aed) 8%, var(--sc-box-2));
}

.swap-token-btn-ico .coin {
  width: 28px;
  height: 28px;
}

.swap-token-btn-copy {
  text-align: left;
  min-width: 0;
  flex: 1;
}

.swap-token-btn-copy b {
  display: block;
  font-size: 14px;
  line-height: 1.2;
}

.swap-token-btn-copy small {
  display: block;
  font-size: 10px;
  color: var(--dash-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.swap-net-code {
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--transfer-accent, #a78bfa);
}

.swap-token-net {
  display: none;
}

.swap-token-net .coin {
  width: 18px;
  height: 18px;
  opacity: 0.85;
}

.swap-token-sheet-list--nets .swap-net-code {
  font-size: 11px;
  margin-left: 4px;
}

.swap-token-chev {
  margin-left: auto;
  font-size: 12px;
  opacity: 0.7;
}

.swap-exchange-details {
  display: grid;
  gap: 0;
  margin: 0;
  border: 0;
  border-top: 1px solid var(--sc-box-line);
  border-radius: 0;
  overflow: hidden;
  background: color-mix(in srgb, var(--transfer-accent, #7c3aed) 3%, transparent);
}

.swap-exchange-rate {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 18px;
  border-bottom: 1px solid color-mix(in srgb, var(--sc-box-line) 75%, transparent);
  font-size: 13px;
  min-width: 0;
}

.swap-exchange-rate:last-child {
  border-bottom: 0;
}

.swap-exchange-rate span {
  color: var(--dash-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  flex: none;
}

.swap-exchange-rate b {
  font-size: 13px;
  text-align: right;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.swap-exchange-rate--accent b {
  color: var(--transfer-accent, #7c3aed);
}

.swap-exchange-foot {
  padding: 14px 18px 18px;
  border-top: 1px solid var(--sc-box-line);
  background: var(--sc-box-2);
  box-sizing: border-box;
}

.swap-exchange-cta {
  min-height: 48px;
  font-size: 15px;
  font-weight: 700;
  border-radius: 12px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.swap-next-hint {
  margin: 10px 0 0;
}

.swap-exchange-live {
  font-size: 11px;
  font-weight: 700;
  color: var(--transfer-accent, #7c3aed);
  animation: swapLivePulse 1.2s ease-in-out infinite;
}

@keyframes swapLivePulse {
  0%, 100% { opacity: 0.55; }
  50% { opacity: 1; }
}

.swap-token-sheet {
  position: absolute;
  inset: 0;
  z-index: 5;
  display: flex;
  flex-direction: column;
  border: 0;
  border-radius: inherit;
  background: color-mix(in srgb, var(--sc-box-2) 96%, transparent);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: none;
}

.swap-token-sheet--in {
  animation: swapSheetIn 0.28s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes swapSheetIn {
  from { opacity: 0; transform: translateY(8px) scale(0.98); }
  to { opacity: 1; transform: none; }
}

.swap-token-sheet-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  border-bottom: 1px solid var(--sc-box-line);
}

.swap-token-sheet-list {
  flex: 1;
  overflow: auto;
  padding: 8px;
}

.transfer-net-compact .asset-pick-list {
  max-height: 180px;
  overflow: auto;
}

.transfer-receive-layout--v2 .transfer-qr-card--v2 {
  border: 1px solid color-mix(in srgb, var(--transfer-accent, #059669) 20%, var(--sc-box-line));
  border-radius: 16px;
  background: color-mix(in srgb, var(--transfer-accent, #059669) 4%, var(--sc-canvas));
  padding: 20px;
  text-align: center;
  animation: transferStepIn 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.transfer-qr-frame--v2 .qr {
  width: min(220px, 70vw);
  height: auto;
  margin: 0 auto;
}

.transfer-balance-chip--v2 {
  margin-bottom: 12px;
}

.transfer-insight-card {
  animation: transferInsightIn 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes transferInsightIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

@media (max-width: 900px) {
  .transfer-tabnav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .transfer-tabnav-copy b {
    font-size: 12px;
  }

  .transfer-side--v2 {
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid var(--sc-box-line);
    padding-top: var(--sc-page-gap);
  }

  .swap-exchange-row {
    flex-wrap: nowrap;
  }

  .swap-token-btn {
    max-width: 46%;
  }
}

@media (max-width: 640px) {
  .swap-exchange-row {
    flex-wrap: wrap;
  }

  .swap-exchange-amount {
    width: 100%;
    flex: 1 1 100%;
  }

  .swap-token-btn {
    width: 100%;
    max-width: none;
  }

  .swap-exchange-meta {
    white-space: normal;
  }

  .swap-exchange-rate b {
    white-space: normal;
    text-align: left;
  }
}

/* Theme and personalization safety layer.
   Loaded last so visual presets cannot break forms, swaps, modals, or buttons. */
html[data-theme="light"] {
  color-scheme: light;
  --dash-bg: #eef2f6;
  --dash-panel: #ffffff;
  --dash-text: #0f172a;
  --dash-muted: #475569;
  --dash-faint: #64748b;
  --dash-line: rgba(15, 23, 42, 0.12);
  --dash-side: #111827;
  --dash-side-text: #cbd5e1;
  --sc-canvas: #eef2f6;
  --sc-box: #ffffff;
  --sc-box-2: #f8fafc;
  --sc-box-line: rgba(15, 23, 42, 0.12);
  --glass-bg: rgba(255, 255, 255, 0.9);
  --glass-blur: 12px;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --dash-bg: #0b0c0e;
  --dash-panel: #141518;
  --dash-text: #f4f4f5;
  --dash-muted: #a1a1aa;
  --dash-faint: #71717a;
  --dash-line: rgba(255, 255, 255, 0.09);
  --dash-side: #0d0e10;
  --dash-side-text: #a1a1aa;
  --sc-canvas: #0b0c0e;
  --sc-box: #141518;
  --sc-box-2: #1a1b1f;
  --sc-box-line: rgba(255, 255, 255, 0.09);
  --glass-bg: rgba(20, 21, 24, 0.9);
  --glass-blur: 16px;
}

html[data-accent="blue"] { --dash-primary: #2563eb; }
html[data-accent="cyan"] { --dash-primary: #0891b2; }
html[data-accent="teal"] { --dash-primary: #0d9488; }
html[data-accent="green"] { --dash-primary: #16a34a; }
html[data-accent="violet"] { --dash-primary: #7c3aed; }
html[data-accent="amber"] { --dash-primary: #d97706; }
html[data-accent="orange"] { --dash-primary: #ea580c; }
html[data-accent="rose"] { --dash-primary: #e11d48; }
html[data-accent="slate"] { --dash-primary: #475569; }
html[data-theme="dark"][data-accent="blue"] { --dash-primary: #60a5fa; }
html[data-theme="dark"][data-accent="cyan"] { --dash-primary: #22d3ee; }
html[data-theme="dark"][data-accent="teal"] { --dash-primary: #2dd4bf; }
html[data-theme="dark"][data-accent="green"] { --dash-primary: #4ade80; }
html[data-theme="dark"][data-accent="violet"] { --dash-primary: #a78bfa; }
html[data-theme="dark"][data-accent="amber"] { --dash-primary: #fbbf24; }
html[data-theme="dark"][data-accent="orange"] { --dash-primary: #fb923c; }
html[data-theme="dark"][data-accent="rose"] { --dash-primary: #fb7185; }
html[data-theme="dark"][data-accent="slate"] { --dash-primary: #94a3b8; }
html[data-accent="custom"] { --dash-primary: var(--dash-accent-custom, #2563eb); }

.dash-body,
.dash-body .page-case,
.dash-body .ui-card,
.dash-body .glass-card,
.dash-body .bento-card,
.dash-body .transfer-main,
.dash-body .transfer-side,
.dash-body .modal,
.dash-body .action-gui,
.dash-body .recv-gui,
.dash-body .pop,
.dash-body .chat-box,
.dash-body .hw-modal {
  color: var(--dash-text);
}

.dash-body input:not([type="radio"]):not([type="checkbox"]):not([type="range"]),
.dash-body select,
.dash-body textarea,
.dash-body .swap-exchange-amount,
.dash-body .transfer-amount-input {
  background: var(--dash-panel) !important;
  color: var(--dash-text) !important;
  border-color: var(--dash-line) !important;
  caret-color: var(--dash-primary);
}

.dash-body input::placeholder,
.dash-body textarea::placeholder {
  color: var(--dash-faint);
  opacity: 1;
}

.dash-body .btn,
.dash-body button,
.dash-body [role="button"],
.dash-body [data-go],
.dash-body [data-act],
.dash-body #swQuote,
.dash-body #swapAuthSubmit,
.dash-body .transfer-submit,
.dash-body .slide-confirm input,
.dash-body .swap-token-btn,
.dash-body .wallet-net-btn {
  pointer-events: auto;
}

.dash-body .btn,
.dash-body .transfer-submit,
.dash-body #swQuote,
.dash-body #swapAuthSubmit {
  min-height: 44px;
  touch-action: manipulation;
  position: relative;
  z-index: 1;
}

.dash-body .btn-primary,
.dash-body .transfer-submit,
.dash-body #swQuote,
.dash-body #swapAuthSubmit {
  background: var(--dash-primary) !important;
  border-color: var(--dash-primary) !important;
  color: #fff !important;
}

html[data-theme="dark"] .dash-body .btn-primary,
html[data-theme="dark"] .dash-body .transfer-submit,
html[data-theme="dark"] .dash-body #swQuote,
html[data-theme="dark"] .dash-body #swapAuthSubmit {
  color: #020617 !important;
}

html[data-accent-fx] .dash-body #swQuote,
html[data-accent-fx] .dash-body #swapAuthSubmit,
html[data-accent-fx] .dash-body .transfer-submit,
html[data-motion] .dash-body #swQuote,
html[data-motion] .dash-body #swapAuthSubmit {
  filter: none !important;
  transform: none;
}

html[data-surface="flat"] .dash-body .transfer-main,
html[data-surface="flat"] .dash-body .transfer-side,
html[data-surface="flat"] .dash-body .modal,
html[data-surface="flat"] .dash-body .action-gui,
html[data-surface="flat"] .dash-body .recv-gui,
html[data-surface="flat"] .dash-body .settings-control-banner,
html[data-surface="flat"] .dash-body .settings-tab-card {
  background: var(--dash-panel) !important;
  border-color: var(--dash-line) !important;
}

html[data-density] .dash-body .transfer-main,
html[data-density] .dash-body .transfer-side,
html[data-density] .dash-body .swap-exchange,
html[data-density] .dash-body .swap-confirm-studio {
  min-width: 0;
  overflow: visible;
}

/* Send page polish */
.transfer-page--send .transfer-body--v2 {
  flex: 1;
  min-height: 0;
  width: 100%;
}

.transfer-page--send .transfer-layout.has-side {
  align-items: stretch;
}

.transfer-page--send .transfer-main--v2 {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.transfer-page--send .transfer-section {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 0;
  border-bottom: 0;
}

.transfer-page--send .transfer-section-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  width: 100%;
  margin-top: 0;
}

.send-panel {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  width: 100%;
  min-width: 0;
  height: 100%;
  padding: 14px 16px 16px;
  border: 1px solid var(--sc-box-line);
  border-radius: 16px;
  background: var(--sc-box-2);
  box-sizing: border-box;
}

.send-panel-head {
  flex: none;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--sc-box-line);
}

.send-panel-head h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.send-panel-head p {
  margin: 5px 0 0;
  font-size: 13px;
  color: var(--dash-muted);
  line-height: 1.45;
}

.send-panel-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px 12px;
  flex: 1;
  min-height: 0;
  width: 100%;
  min-width: 0;
  align-content: start;
}

.send-panel-body > .send-metrics,
.send-panel-body > .transfer-field:nth-child(2),
.send-panel-body > .send-preview-card,
.send-panel-body > .transfer-submit {
  grid-column: 1 / -1;
}

.send-panel-body > .transfer-submit {
  margin-top: auto;
  align-self: stretch;
}

.send-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 0;
}

.send-metric {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 10px;
  border: 1px solid var(--sc-box-line);
  border-radius: 12px;
  background: color-mix(in srgb, var(--dash-primary) 4%, var(--sc-box-2));
}

.send-metric > span {
  color: var(--dash-muted);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.send-metric b {
  min-width: 0;
  color: var(--dash-text);
  font-size: 14px;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.send-metric b small {
  color: var(--dash-muted);
  font-size: 11px;
  font-weight: 600;
}

.send-recent-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
}

.send-recent-label {
  flex: none;
  color: var(--dash-muted);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.send-recent-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.send-recent-chip {
  max-width: 100%;
  padding: 5px 10px;
  border: 1px solid var(--sc-box-line);
  border-radius: 999px;
  background: var(--dash-panel);
  color: var(--dash-text);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.send-recent-chip:hover {
  border-color: color-mix(in srgb, var(--dash-primary) 40%, var(--sc-box-line));
  background: color-mix(in srgb, var(--dash-primary) 8%, var(--dash-panel));
}

.send-preview-card {
  grid-column: 1 / -1;
  padding: 12px;
  border: 1px solid var(--sc-box-line);
  border-radius: 14px;
  background: var(--dash-panel);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.send-preview-card.is-ready {
  border-color: color-mix(in srgb, var(--dash-primary) 35%, var(--sc-box-line));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--dash-primary) 12%, transparent);
}

.send-preview-card.is-over {
  border-color: color-mix(in srgb, var(--dash-danger, #e5484d) 35%, var(--sc-box-line));
}

.send-preview-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
  color: var(--dash-muted);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.send-preview-ready {
  padding: 2px 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--dash-primary) 14%, transparent);
  color: var(--dash-primary);
  font-style: normal;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.send-preview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 14px;
}

.send-preview-row {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.send-preview-row span {
  color: var(--dash-muted);
  font-size: 11px;
}

.send-preview-row b {
  min-width: 0;
  color: var(--dash-text);
  font-size: 13px;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.send-preview-free {
  color: var(--dash-primary) !important;
}

.send-preview-warn {
  margin: 10px 0 0;
  color: var(--dash-danger, #e5484d);
  font-size: 12px;
  line-height: 1.35;
}

.transfer-page--send .transfer-section--inset {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.transfer-page--send .transfer-section-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  width: 100%;
  margin-top: 0;
  gap: 0;
}

.send-asset-select {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(120px, 38%);
  align-items: center;
  gap: 10px;
  min-height: 52px;
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--sc-box-line);
  border-radius: 12px;
  background: var(--dash-panel);
  box-sizing: border-box;
}

.send-asset-current {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

.send-asset-current .coin {
  width: 34px;
  height: 34px;
  flex: none;
}

.send-asset-current div {
  min-width: 0;
}

.send-asset-current b,
.send-asset-current small {
  display: block;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.send-asset-current b {
  font-size: 14px;
  line-height: 1.2;
}

.send-asset-current small {
  margin-top: 2px;
  color: var(--dash-muted);
  font-size: 12px;
}

.send-asset-select select {
  width: 100%;
  min-width: 0;
  max-width: none;
  height: 36px;
  min-height: 36px;
  padding: 0 30px 0 10px;
  border-radius: 10px;
  background: var(--sc-box-2) !important;
  font-size: 12px;
  font-weight: 650;
}

.transfer-page--send .transfer-field {
  min-width: 0;
}

.transfer-page--send .transfer-input,
.transfer-page--send .transfer-amount-input {
  min-height: 42px;
  border-radius: 12px;
}

.transfer-page--send .transfer-amount-input {
  padding: 10px 12px;
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  text-align: left;
}

.transfer-page--send .transfer-submit {
  margin-top: 2px;
  min-height: 46px;
}

.transfer-page--send .transfer-submit.is-disabled,
.transfer-page--send .transfer-submit:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  pointer-events: none;
}

.transfer-page--send .transfer-submit--pulse:not(.is-loading) {
  animation: none;
}

@media (max-width: 620px) {
  .send-panel-body {
    grid-template-columns: 1fr;
  }

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

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

  .send-asset-select {
    grid-template-columns: 1fr;
  }
}

/* Hardware wallet — Ledger & Trezor theme layer */
html {
  --hw-trezor: #00854d;
  --hw-trezor-bright: #34d399;
}

html[data-theme="dark"] {
  --hw-trezor: #34d399;
  --hw-trezor-bright: #6ee7b7;
}

.dash-body .hw-modal,
.dash-body .hw-modal-inner,
.dash-body .hw-action-card,
.dash-body .hw-panel {
  color: var(--dash-text);
}

.modal:has(> .hw-modal) {
  background: var(--sc-box, var(--dash-panel));
  border-color: var(--sc-box-line, var(--dash-line));
  box-shadow: 0 24px 64px color-mix(in srgb, var(--dash-text) 16%, transparent);
}

html[data-theme="dark"] .hw-brand-logo {
  filter: brightness(0) invert(1);
  opacity: 0.94;
}

html[data-theme="dark"] .hw-modal-grid {
  opacity: 0.35;
  background-image:
    linear-gradient(color-mix(in srgb, var(--dash-muted) 12%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--dash-muted) 12%, transparent) 1px, transparent 1px);
}

html[data-theme="dark"] .hw-modal-orb--a {
  background: color-mix(in srgb, var(--dash-muted) 18%, transparent);
}

html[data-theme="dark"] .hw-modal-orb--b {
  background: color-mix(in srgb, var(--dash-primary) 8%, transparent);
}

html[data-theme="dark"] .hw-modal-scan {
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--dash-muted) 55%, transparent), transparent);
}

.hw-modal--trezor {
  background: linear-gradient(180deg, var(--sc-box) 0%, var(--sc-box-2) 55%, color-mix(in srgb, var(--hw-trezor) 6%, var(--sc-box-2)) 100%);
}

.hw-modal--trezor .hw-modal-orb--b {
  background: color-mix(in srgb, var(--hw-trezor) 22%, transparent);
}

.hw-modal--trezor .hw-modal-scan {
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--hw-trezor) 55%, transparent), transparent);
}

.hw-brand-logo--trezor {
  height: 26px;
  width: auto;
}

.hw-modal--trezor .hw-carousel-viewport {
  background:
    radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--hw-trezor) 8%, transparent), transparent 58%),
    linear-gradient(180deg, var(--sc-box), var(--sc-box-2));
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--dash-text) 6%, transparent);
}

.hw-modal--trezor .hw-carousel-glow {
  background: radial-gradient(circle, color-mix(in srgb, var(--hw-trezor) 14%, transparent), transparent 72%);
}

.hw-modal--trezor .hw-carousel-nav:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--hw-trezor) 35%, var(--dash-line));
}

.hw-modal--trezor .hw-carousel-dot:hover {
  background: color-mix(in srgb, var(--hw-trezor) 45%, transparent);
}

.hw-modal--trezor .hw-carousel-select,
.hw-modal--trezor .hw-cta-btn.btn-primary {
  background: linear-gradient(135deg, var(--hw-trezor), color-mix(in srgb, var(--hw-trezor) 78%, #000));
  border-color: color-mix(in srgb, var(--hw-trezor) 25%, transparent);
}

.hw-modal--trezor .hw-step.current {
  background: color-mix(in srgb, var(--hw-trezor) 8%, var(--sc-box-2));
}

.hw-modal--trezor .hw-connect-row.is-active {
  color: var(--hw-trezor);
  background: color-mix(in srgb, var(--hw-trezor) 6%, transparent);
}

.hw-modal--trezor .hw-connect-row.is-active .hw-connect-icon {
  border-color: var(--hw-trezor);
  color: var(--hw-trezor);
}

.hw-modal--trezor .hw-lock-ring {
  border-color: color-mix(in srgb, var(--hw-trezor) 28%, transparent);
}

.hw-modal--trezor .hw-sign-wave {
  border-color: color-mix(in srgb, var(--hw-trezor) 16%, transparent);
}

.hw-modal--trezor .hw-app-icons span.on {
  border-color: var(--hw-trezor);
  color: var(--hw-trezor);
  background: color-mix(in srgb, var(--hw-trezor) 8%, transparent);
}

.wallet-btn--hw[data-hw="ledger"]:hover {
  border-color: color-mix(in srgb, var(--dash-primary) 35%, var(--sc-box-line));
  background: color-mix(in srgb, var(--dash-primary) 6%, var(--sc-box-2));
}

.wallet-btn--hw[data-hw="trezor"]:hover {
  border-color: color-mix(in srgb, var(--hw-trezor) 35%, var(--sc-box-line));
  background: color-mix(in srgb, var(--hw-trezor) 6%, var(--sc-box-2));
}

.dash-nav .nav-hw {
  color: var(--dash-side-text, #cbd5e1);
}

.dash-nav .nav-hw .nav-ico {
  color: inherit;
}

html[data-theme="light"] .dash-nav .nav-hw--ledger.on,
html[data-theme="light"] .dash-nav .nav-hw--ledger:hover {
  background: color-mix(in srgb, var(--dash-primary) 12%, rgba(255, 255, 255, 0.06));
}

html[data-theme="light"] .dash-nav .nav-hw--trezor.on,
html[data-theme="light"] .dash-nav .nav-hw--trezor:hover {
  background: color-mix(in srgb, var(--hw-trezor) 16%, rgba(255, 255, 255, 0.06));
}

html[data-theme="dark"] .hw-step,
html[data-theme="dark"] .hw-modal--ledger .hw-step {
  background: color-mix(in srgb, var(--dash-muted) 10%, var(--sc-box-2));
}

html[data-theme="dark"] .hw-progress-track,
html[data-theme="dark"] .hw-modal--ledger .hw-progress-track {
  background: color-mix(in srgb, var(--dash-muted) 22%, transparent);
}

html[data-theme="dark"] .hw-carousel-counter,
html[data-theme="dark"] .hw-carousel-era {
  background: color-mix(in srgb, var(--dash-muted) 14%, var(--sc-box-2));
}

html[data-theme="dark"] .hw-usb-cable {
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--dash-muted) 55%, transparent), transparent);
}

html[data-theme="dark"] .nav-hw--ledger.on,
html[data-theme="dark"] .nav-hw--ledger:hover {
  background: color-mix(in srgb, var(--dash-primary) 16%, rgba(255, 255, 255, 0.04));
}

html[data-theme="dark"] .nav-hw--trezor.on,
html[data-theme="dark"] .nav-hw--trezor:hover {
  background: color-mix(in srgb, var(--hw-trezor) 18%, rgba(255, 255, 255, 0.04));
}

html[data-theme="dark"] .hw-device-img--hero,
html[data-theme="dark"] .hw-device-img--scene {
  filter: drop-shadow(0 16px 28px rgba(0, 0, 0, 0.45));
}

html[data-theme="dark"] .hw-carousel-art svg,
html[data-theme="dark"] .hw-device-svg {
  filter: drop-shadow(0 14px 24px rgba(0, 0, 0, 0.35));
}

.dash-body .hw-close-btn,
.dash-body .hw-carousel-nav,
.dash-body .hw-carousel-thumb,
.dash-body .hw-carousel-counter {
  background: var(--dash-panel) !important;
  color: var(--dash-text) !important;
  border-color: var(--dash-line) !important;
}

.dash-body .hw-modal .app-muted,
.dash-body .hw-modal .transfer-hint {
  color: var(--dash-muted) !important;
}

.dash-body .hw-modal .btn-primary.hw-carousel-select,
.dash-body .hw-modal .btn-primary.hw-cta-btn {
  color: #fff !important;
}

.dash-body .hw-modal input,
.dash-body .hw-modal select,
.dash-body .hw-modal textarea {
  background: var(--dash-panel) !important;
  color: var(--dash-text) !important;
  border-color: var(--dash-line) !important;
}