html.simplecard-p2p-theme {
  --app-canvas: #f3f2ef;
  --app-canvas-highlight: #ffffff;
  --surface: #ffffff;
  --surface-subtle: #f6f7f8;
  --surface-raised: #ffffff;
  --text: #17191c;
  --text-secondary: #70757d;
  --line: #e2e5e8;
  --overlay: rgba(19, 22, 27, .38);
  --shadow: rgba(32, 35, 41, .1);
  --blue: #0b63ce;
  --action: #0b63ce;
  --blue-soft: #eaf3ff;
  --green: #198754;
  --danger: #a13232;
  --danger-action: #a13232;
  --danger-on-action: #ffffff;
  --warning: #795810;
  --warning-soft: #fff5dd;
  --danger-soft: #fff0f0;
  --on-primary: #ffffff;
  --profile-card-surface: #f2f4f7;
  --profile-card-border: #c7d0da;
  --profile-card-divider: #d9dee5;
  --profile-card-shadow: 0 14px 30px rgba(32, 35, 41, .08);
  --app-top-bar-height: 62px;
  --app-bottom-nav-height: 70px;
  --app-safe-area-bottom: env(safe-area-inset-bottom, 0px);
  --app-bottom-nav-safe-area: min(env(safe-area-inset-bottom, 0px), 14px);
  --app-bottom-nav-occupied-height: calc(var(--app-bottom-nav-height) + var(--app-bottom-nav-safe-area));
  --app-shell-bottom-gap: 0px;
  --app-content-available-height: calc(100dvh - var(--app-top-bar-height) - env(safe-area-inset-top, 0px) - var(--app-bottom-nav-occupied-height) - var(--app-shell-bottom-gap));
  --app-content-padding-block: 16px;
  background: var(--app-canvas) !important;
  color: var(--text) !important;
}

@view-transition {
  navigation: auto;
}

::view-transition-group(root) {
  animation-duration: 140ms;
  animation-timing-function: ease-out;
}

::view-transition-old(root),
::view-transition-new(root) {
  background: var(--app-canvas);
  mix-blend-mode: normal;
}

::view-transition-old(root) {
  animation-name: simplecard-root-exit;
}

::view-transition-new(root) {
  animation-name: simplecard-root-enter;
}

@keyframes simplecard-root-exit {
  from,
  to {
    opacity: 1;
  }
}

@keyframes simplecard-root-enter {
  from {
    opacity: .985;
  }

  to {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(root) {
    animation-duration: 1ms;
  }
}

html.simplecard-p2p-theme[data-theme="dark"] {
  color-scheme: dark;
  --app-canvas: #0b0d10;
  --app-canvas-highlight: #161a20;
  --surface: #111419;
  --surface-subtle: #181c22;
  --surface-raised: #1d2229;
  --text: #f3f5f7;
  --text-secondary: #aeb5bf;
  --line: #2c323b;
  --overlay: rgba(0, 0, 0, .7);
  --shadow: rgba(0, 0, 0, .42);
  --blue: #5ba1ff;
  --action: #1468c9;
  --blue-soft: #142b49;
  --green: #53c78e;
  --danger: #ff8b8b;
  --danger-action: #9f3535;
  --danger-on-action: #ffffff;
  --warning: #f0c768;
  --warning-soft: #332a14;
  --danger-soft: #36191e;
  --profile-card-surface: #171b21;
  --profile-card-border: #343b46;
  --profile-card-divider: #303743;
  --profile-card-shadow: none;
}

html.simplecard-p2p-theme body {
  min-width: 320px;
  box-sizing: border-box !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  overflow: hidden !important;
  padding: calc(var(--app-top-bar-height) + env(safe-area-inset-top, 0px)) 0 calc(var(--app-bottom-nav-occupied-height) + var(--app-shell-bottom-gap)) !important;
  background: var(--app-canvas) !important;
  background-image: none !important;
  color: var(--text) !important;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif !important;
}

@media (max-width: 1023px) {
  html.simplecard-p2p-theme,
  html.simplecard-p2p-theme body {
    background: var(--surface) !important;
  }
}

html.simplecard-p2p-theme body::before,
html.simplecard-p2p-theme .glass::before,
html.simplecard-p2p-theme .glass-rim,
html.simplecard-p2p-theme .nav {
  display: none !important;
}

html.simplecard-p2p-theme body::after {
  display: none !important;
}

@media (max-width: 1023px) {
  html.simplecard-p2p-theme body::after {
    content: "";
    position: fixed;
    z-index: 3980;
    left: 50%;
    bottom: 0;
    display: block !important;
    width: min(100%, 480px);
    height: calc(var(--app-bottom-nav-occupied-height) + 2px);
    transform: translateX(-50%);
    border-radius: 0;
    background: var(--surface);
    opacity: 1;
    filter: none;
    will-change: auto;
    pointer-events: none;
  }
}

html.simplecard-p2p-theme .page-layout {
  width: min(100%, 480px);
  height: var(--app-content-available-height);
  min-height: 0;
  margin: 0 auto;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: var(--surface);
  color: var(--text);
}

html.simplecard-p2p-theme .page-layout.is-content-fit {
  overflow-y: hidden;
}

html.simplecard-p2p-theme .page-layout.is-content-fit > .page-main {
  min-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

html.simplecard-p2p-theme .page-layout > .page-main {
  min-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: safe center !important;
}

html.simplecard-p2p-theme body.legal-shell .page-layout > .page-main,
html.simplecard-p2p-theme body.legal-shell .page-layout.is-content-fit > .page-main {
  justify-content: flex-start !important;
}

html.simplecard-p2p-theme body.legal-shell .legal-document {
  align-content: start;
}

html.simplecard-p2p-theme body.legal-shell .legal-tabs {
  position: sticky;
  top: 0;
  z-index: 5;
  gap: 0;
  margin-top: 0;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--surface-subtle);
  padding: 4px;
}

html.simplecard-p2p-theme body.legal-shell .legal-tabs a {
  min-height: 40px;
  border: 0;
  background: transparent;
}

html.simplecard-p2p-theme body.legal-shell .legal-tabs a.active {
  background: var(--action);
  color: var(--on-primary);
}

html.simplecard-p2p-theme body:has(#view-login:not([hidden])) .page-layout,
html.simplecard-p2p-theme body:has(#view-2fa:not([hidden])) .page-layout,
html.simplecard-p2p-theme body:has(#view-pin-setup:not([hidden])) .page-layout,
html.simplecard-p2p-theme body:has(#view-legal-gate:not([hidden])) .page-layout {
  height: var(--app-content-available-height);
  min-height: var(--app-content-available-height);
  gap: 0;
}

html.simplecard-p2p-theme body:has(#view-login:not([hidden])) #app-page-main,
html.simplecard-p2p-theme body:has(#view-2fa:not([hidden])) #app-page-main,
html.simplecard-p2p-theme body:has(#view-pin-setup:not([hidden])) #app-page-main,
html.simplecard-p2p-theme body:has(#view-legal-gate:not([hidden])) #app-page-main {
  height: var(--app-content-available-height);
  flex: 0 0 var(--app-content-available-height);
  padding: 0 !important;
}

html.simplecard-p2p-theme .page-main,
html.simplecard-p2p-theme .shell,
html.simplecard-p2p-theme .container,
html.simplecard-p2p-theme .hero {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

html.simplecard-p2p-theme .page-main,
html.simplecard-p2p-theme .container {
  padding: var(--app-content-padding-block) 16px !important;
}

html.simplecard-p2p-theme .hero {
  padding: 28px 16px calc(var(--app-bottom-nav-occupied-height) + 22px) !important;
  text-align: left !important;
}

html.simplecard-p2p-theme body.landing-shell {
  height: 100dvh !important;
  min-height: 100dvh !important;
  overflow: hidden !important;
  padding-bottom: var(--app-bottom-nav-occupied-height) !important;
}

html.simplecard-p2p-theme body.landing-shell .page-layout {
  height: var(--app-content-available-height) !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
}

html.simplecard-p2p-theme body.landing-shell .page-main {
  min-height: 100% !important;
  overflow: visible !important;
  padding: 0 16px !important;
}

html.simplecard-p2p-theme body.landing-shell .hero {
  height: auto !important;
  min-height: 100% !important;
  padding: clamp(14px, 3dvh, 24px) 0 !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

html.simplecard-p2p-theme body.landing-shell .hero-title,
html.simplecard-p2p-theme body.landing-shell .hero-card-preview,
html.simplecard-p2p-theme body.landing-shell .hero-sub,
html.simplecard-p2p-theme body.landing-shell .hero-cta {
  flex: 0 0 auto;
}

html.simplecard-p2p-theme body.landing-shell .hero-title {
  max-width: 420px;
  margin: 0 auto 16px !important;
  font-size: clamp(2.35rem, 10vw, 3.2rem) !important;
  line-height: 1.04 !important;
}

html.simplecard-p2p-theme body.landing-shell .hero-card-preview {
  width: min(100%, 390px) !important;
  margin: 0 auto 16px !important;
}

html.simplecard-p2p-theme body.landing-shell .hero-sub {
  max-width: 390px !important;
  margin: 0 auto !important;
  text-align: center !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
}

html.simplecard-p2p-theme body.landing-shell .hero-cta {
  width: 100%;
  margin-top: 22px !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 10px !important;
}

html.simplecard-p2p-theme body.landing-shell .hero-btn {
  width: 100%;
  justify-content: center;
  padding-right: 14px !important;
  padding-left: 14px !important;
}

@media (max-width: 420px) {
  html.simplecard-p2p-theme body.landing-shell .hero {
    justify-content: center !important;
  }

  html.simplecard-p2p-theme body.landing-shell .hero-cta {
    grid-template-columns: 1fr;
  }
}

html.simplecard-p2p-theme .page-main--center {
  min-height: max(360px, var(--app-content-available-height));
}

html.simplecard-p2p-theme .hero-title,
html.simplecard-p2p-theme h1 {
  background: none !important;
  color: var(--text) !important;
  letter-spacing: 0 !important;
  -webkit-text-fill-color: currentColor !important;
}

html.simplecard-p2p-theme .hero-title {
  margin: 32px 0 14px !important;
  font-size: clamp(2.15rem, 11vw, 3rem) !important;
  line-height: .98 !important;
}

html.simplecard-p2p-theme .hero-sub,
html.simplecard-p2p-theme .summary,
html.simplecard-p2p-theme .bio,
html.simplecard-p2p-theme .instruction,
html.simplecard-p2p-theme .section-title p,
html.simplecard-p2p-theme .error-sub {
  color: var(--text-secondary) !important;
}

html.simplecard-p2p-theme .card,
html.simplecard-p2p-theme .feature-card,
html.simplecard-p2p-theme .shop-card,
html.simplecard-p2p-theme .step-card,
html.simplecard-p2p-theme .login-card,
html.simplecard-p2p-theme .preview-card,
html.simplecard-p2p-theme .stats-main,
html.simplecard-p2p-theme .security-modal-card,
html.simplecard-p2p-theme .offline-card {
  overflow: hidden;
  border: 1px solid var(--line) !important;
  border-radius: 16px !important;
  background: var(--surface) !important;
  color: var(--text) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  animation: none !important;
  transform: none !important;
}

html.simplecard-p2p-theme body.profile-page .card {
  background: var(--profile-card-surface) !important;
  border-color: var(--profile-card-border) !important;
  box-shadow: var(--profile-card-shadow) !important;
}

html.simplecard-p2p-theme body.profile-page .card::before,
html.simplecard-p2p-theme body.profile-page .glass-rim {
  display: none !important;
}

html.simplecard-p2p-theme body.profile-page .divider {
  background: var(--profile-card-divider) !important;
}

html.simplecard-p2p-theme .cards-grid,
html.simplecard-p2p-theme .shops-grid,
html.simplecard-p2p-theme .steps-list,
html.simplecard-p2p-theme .stats-kpi-grid,
html.simplecard-p2p-theme .stats-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
}

html.simplecard-p2p-theme .feature-card,
html.simplecard-p2p-theme .shop-card,
html.simplecard-p2p-theme .step-card {
  min-height: 58px;
  padding: 14px !important;
}

html.simplecard-p2p-theme .section-title {
  margin: 22px 0 12px !important;
  color: var(--text) !important;
  font-size: 23px !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
}

html.simplecard-p2p-theme .btn,
html.simplecard-p2p-theme .hero-btn,
html.simplecard-p2p-theme .call-btn,
html.simplecard-p2p-theme .report-submit {
  min-height: 48px;
  border-radius: 12px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 750 !important;
}

html.simplecard-p2p-theme .btn-primary,
html.simplecard-p2p-theme .hero-btn,
html.simplecard-p2p-theme .call-btn,
html.simplecard-p2p-theme .report-submit {
  background: var(--action) !important;
  color: var(--on-primary) !important;
}

html.simplecard-p2p-theme .btn-secondary,
html.simplecard-p2p-theme .hero-btn-secondary {
  border: 1px solid var(--line) !important;
  background: var(--surface) !important;
  color: var(--text) !important;
}

html.simplecard-p2p-theme .report-toggle {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 1.9rem !important;
  padding: .32rem .75rem !important;
  border: 1px solid var(--line) !important;
  border-radius: 999px !important;
  background: var(--surface-subtle) !important;
  color: var(--text-secondary) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  white-space: nowrap !important;
}

html.simplecard-p2p-theme input,
html.simplecard-p2p-theme textarea,
html.simplecard-p2p-theme select,
html.simplecard-p2p-theme .glass-input {
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  background: var(--surface) !important;
  color: var(--text) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html.simplecard-p2p-theme #security-modal,
html.simplecard-p2p-theme .confirm-overlay {
  background: var(--overlay) !important;
  opacity: 1 !important;
  animation: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html.simplecard-p2p-theme #security-modal {
  inset: calc(var(--app-top-bar-height) + env(safe-area-inset-top, 0px)) 0 var(--app-bottom-nav-occupied-height) !important;
  align-items: flex-start !important;
  padding: 16px calc(16px + env(safe-area-inset-right, 0px)) 16px calc(16px + env(safe-area-inset-left, 0px)) !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
}

html.simplecard-p2p-theme .security-modal-card {
  width: 100% !important;
  max-width: 440px !important;
  max-height: none !important;
  margin: 0 auto !important;
  overflow: visible !important;
}

html.simplecard-p2p-theme .security-modal-card .glass-inner {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.simplecard-p2p-theme #security-modal .security-section {
  margin: 0 !important;
  padding: 0 !important;
  border-top: 0 !important;
}

html.simplecard-p2p-theme .security-modal-head,
html.simplecard-p2p-theme .security-head {
  gap: 14px !important;
  margin-bottom: 18px !important;
}

html.simplecard-p2p-theme .security-title {
  color: var(--text) !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html.simplecard-p2p-theme .security-sub,
html.simplecard-p2p-theme .security-panel-sub,
html.simplecard-p2p-theme .security-note,
html.simplecard-p2p-theme .pin-hint,
html.simplecard-p2p-theme .pin-rules {
  color: var(--text-secondary) !important;
}

html.simplecard-p2p-theme .security-modal-close {
  width: 40px !important;
  height: 40px !important;
  border: 1px solid var(--line) !important;
  border-radius: 999px !important;
  background: var(--surface-subtle) !important;
  color: var(--text-secondary) !important;
  font-size: 22px !important;
}

html.simplecard-p2p-theme .security-modal-close:hover {
  color: var(--text) !important;
}

html.simplecard-p2p-theme .status-pill {
  border: 1px solid var(--line) !important;
  background: var(--surface-subtle) !important;
  color: var(--text-secondary) !important;
  box-shadow: none !important;
}

html.simplecard-p2p-theme .status-pill.on {
  border-color: rgba(25, 135, 84, .32) !important;
  background: rgba(25, 135, 84, .12) !important;
  color: var(--green) !important;
}

html.simplecard-p2p-theme .status-pill.pending {
  border-color: rgba(121, 88, 16, .32) !important;
  background: var(--warning-soft) !important;
  color: var(--warning) !important;
}

html.simplecard-p2p-theme .security-panel {
  margin-top: 16px !important;
  padding: 18px !important;
  border: 1px solid var(--line) !important;
  border-radius: 16px !important;
  background: var(--surface-subtle) !important;
  color: var(--text) !important;
  box-shadow: none !important;
}

html.simplecard-p2p-theme .security-panel-title {
  color: var(--text-secondary) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
}

html.simplecard-p2p-theme .secret-code,
html.simplecard-p2p-theme .backup-code-item {
  border: 1px solid var(--line) !important;
  background: var(--surface-raised) !important;
  color: var(--text) !important;
}

html.simplecard-p2p-theme .danger-panel {
  border-color: rgba(161, 50, 50, .34) !important;
  background: var(--danger-soft) !important;
}

html.simplecard-p2p-theme .danger-panel .security-panel-title,
html.simplecard-p2p-theme .danger-copy {
  color: var(--danger) !important;
}

html.simplecard-p2p-theme .danger-panel .pin-hint strong {
  color: var(--text) !important;
}

html.simplecard-p2p-theme .danger-btn {
  border-color: var(--danger-action) !important;
  background: var(--danger-action) !important;
  color: var(--danger-on-action) !important;
}

html.simplecard-p2p-theme .danger-btn:hover:not(:disabled) {
  background: var(--danger-action) !important;
  opacity: .92;
}

html.simplecard-p2p-theme .danger-btn:disabled {
  opacity: .54;
}

html.simplecard-p2p-theme .hero-card-preview,
html.simplecard-p2p-theme .preview-card {
  aspect-ratio: 544 / 355;
  border: 1px solid var(--line) !important;
  border-radius: 18px !important;
  background: var(--surface-subtle) !important;
  box-shadow: none !important;
}

html.simplecard-p2p-theme .hero-card-preview img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

html.simplecard-p2p-theme .simplecard-media-skeleton {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

html.simplecard-p2p-theme .simplecard-media-skeleton::before,
html.simplecard-p2p-theme .simplecard-media-skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  transition: opacity .18s ease;
  z-index: 2;
}

html.simplecard-p2p-theme .simplecard-media-skeleton::before {
  background: linear-gradient(135deg, var(--surface-subtle), color-mix(in srgb, var(--accent) 9%, var(--surface-raised)) 46%, var(--surface-subtle));
}

html.simplecard-p2p-theme .simplecard-media-skeleton::after {
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.2), transparent);
  animation: simplecardSkeletonSweep 1.2s ease-in-out infinite;
}

html.simplecard-p2p-theme .simplecard-media-skeleton:not(.is-loading)::before,
html.simplecard-p2p-theme .simplecard-media-skeleton:not(.is-loading)::after {
  opacity: 0;
}

html.simplecard-p2p-theme .simplecard-media-content {
  position: relative;
  z-index: 1;
  opacity: 1;
  transition: opacity .18s ease;
}

html.simplecard-p2p-theme .simplecard-media-skeleton.is-loading .simplecard-media-content {
  opacity: 0;
}

@keyframes simplecardSkeletonSweep {
  to { transform: translateX(100%); }
}

@media (prefers-reduced-motion: reduce) {
  html.simplecard-p2p-theme .simplecard-media-skeleton::after {
    animation: none;
  }
}

@media (max-width: 1023px) {
  html.simplecard-p2p-theme body.landing-shell {
    background: var(--surface) !important;
  }

  html.simplecard-p2p-theme body.landing-shell .page-layout {
    background: var(--surface) !important;
  }
}

@media (max-width: 620px) and (max-height: 900px) {
  html.simplecard-p2p-theme body.landing-shell .hero-title {
    margin-bottom: 12px !important;
    font-size: clamp(2rem, 9.2vw, 2.85rem) !important;
  }

  html.simplecard-p2p-theme body.landing-shell .hero-card-preview {
    width: min(100%, 360px) !important;
    margin-bottom: 12px !important;
  }

  html.simplecard-p2p-theme body.landing-shell .hero-sub {
    font-size: 14px !important;
    line-height: 1.45 !important;
  }

  html.simplecard-p2p-theme body.landing-shell .hero-cta {
    margin-top: 16px !important;
  }
}

html.simplecard-p2p-theme .cookie-notice {
  bottom: calc(var(--app-bottom-nav-occupied-height) + 12px) !important;
  z-index: 3970 !important;
  width: min(456px, calc(100vw - 24px)) !important;
  padding: 18px 14px 14px !important;
  border: 1px solid var(--line) !important;
  border-radius: 16px !important;
  background: var(--surface) !important;
  color: var(--text) !important;
  box-shadow: 0 12px 34px var(--shadow) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html.simplecard-p2p-theme .cookie-notice::before {
  background: var(--line) !important;
}

html.simplecard-p2p-theme .cookie-notice p {
  color: var(--text-secondary) !important;
}

html.simplecard-p2p-theme .cookie-notice a {
  border: 1px solid var(--line) !important;
  background: var(--surface) !important;
  color: var(--text) !important;
}

html.simplecard-p2p-theme .cookie-notice button {
  border: 1px solid var(--action) !important;
  background: var(--action) !important;
  color: var(--on-primary) !important;
}

html.simplecard-p2p-theme #view-login,
html.simplecard-p2p-theme #view-2fa,
html.simplecard-p2p-theme #view-pin-setup,
html.simplecard-p2p-theme #view-legal-gate {
  box-sizing: border-box !important;
  height: var(--app-content-available-height) !important;
  min-height: var(--app-content-available-height) !important;
  padding: 16px !important;
}

html.simplecard-p2p-theme #view-editor {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  animation: none !important;
}

html.simplecard-p2p-theme .editor-shell {
  padding: 0 env(safe-area-inset-right, 0px) 0 env(safe-area-inset-left, 0px) !important;
}

html.simplecard-p2p-theme .editor-layout {
  grid-template-columns: 1fr !important;
  width: 100% !important;
  max-width: 440px !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

html.simplecard-p2p-theme .preview-col {
  order: -1;
}

@media (min-width: 1024px) {
  html.simplecard-p2p-theme {
    --app-top-bar-height: 80px;
    --app-bottom-nav-height: 0px;
    --app-safe-area-bottom: 0px;
    --app-bottom-nav-safe-area: 0px;
    --app-bottom-nav-occupied-height: 0px;
    --app-shell-bottom-gap: 0px;
    --desktop-sidebar-width: 280px;
    --desktop-workspace-max: 1168px;
    --app-content-available-height: calc(100dvh - var(--app-top-bar-height) - env(safe-area-inset-top, 0px));
  }

  html.simplecard-p2p-theme body {
    padding: calc(var(--app-top-bar-height) + env(safe-area-inset-top, 0px)) 0 0 var(--desktop-sidebar-width) !important;
  }

  html.simplecard-p2p-theme .page-layout {
    width: 100%;
    height: var(--app-content-available-height);
    max-width: none;
    margin: 0;
    border-left: 1px solid var(--line);
    background: var(--surface);
  }

  html.simplecard-p2p-theme .page-layout > .page-main {
    justify-content: safe center !important;
  }

  html.simplecard-p2p-theme .page-main,
  html.simplecard-p2p-theme .container {
    padding: 32px 40px !important;
  }

  html.simplecard-p2p-theme #view-editor {
    min-height: 100% !important;
  }

  html.simplecard-p2p-theme .editor-shell {
    width: 100% !important;
    max-width: none !important;
    min-height: 100% !important;
    padding: 0 !important;
  }

  html.simplecard-p2p-theme .editor-layout {
    width: 100% !important;
    max-width: min(var(--desktop-workspace-max), calc(100vw - var(--desktop-sidebar-width) - 80px)) !important;
    grid-template-columns: minmax(0, 620px) minmax(320px, 388px) !important;
    gap: 32px !important;
    justify-content: center !important;
    align-items: start !important;
  }

  html.simplecard-p2p-theme .editor-col {
    min-width: 0;
  }

  html.simplecard-p2p-theme .preview-col {
    position: sticky !important;
    top: 32px !important;
    order: initial !important;
    min-width: 0;
  }

  html.simplecard-p2p-theme .editor-card,
  html.simplecard-p2p-theme .preview-card,
  html.simplecard-p2p-theme .stats-main,
  html.simplecard-p2p-theme .app-panel-card {
    border-radius: 16px !important;
  }

  html.simplecard-p2p-theme .editor-card {
    padding: 32px !important;
  }

  html.simplecard-p2p-theme .editor-card .glass-inner {
    display: grid;
    gap: 24px;
  }

  html.simplecard-p2p-theme .editor-header {
    display: grid !important;
    gap: 8px;
    margin-bottom: 0 !important;
  }

  html.simplecard-p2p-theme .editor-title {
    color: var(--text) !important;
    font-size: clamp(32px, 3vw, 40px) !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
  }

  html.simplecard-p2p-theme #logout-btn {
    display: none !important;
  }

  html.simplecard-p2p-theme .session-info-grid {
    display: none !important;
  }

  html.simplecard-p2p-theme .field-row {
    padding: 0 0 22px !important;
  }

  html.simplecard-p2p-theme .field-row:last-of-type {
    border-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  html.simplecard-p2p-theme .field-label,
  html.simplecard-p2p-theme .field-char-count {
    color: var(--text-muted) !important;
  }

  html.simplecard-p2p-theme .glass-input {
    min-height: 58px !important;
    border-radius: 12px !important;
  }

  html.simplecard-p2p-theme textarea.glass-input {
    min-height: 164px !important;
  }

  html.simplecard-p2p-theme .save-area {
    margin-top: 2px;
  }

  html.simplecard-p2p-theme #save-btn {
    min-height: 64px;
    border-radius: 12px;
  }

  html.simplecard-p2p-theme .visibility-row,
  html.simplecard-p2p-theme .security-launch-wrap,
  html.simplecard-p2p-theme .twofactor-reminder {
    display: none !important;
  }

  html.simplecard-p2p-theme .preview-label {
    margin: 0 0 14px !important;
    color: var(--text) !important;
    font-size: 26px !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
  }

  html.simplecard-p2p-theme .desktop-sticker-preview {
    display: block;
    margin-bottom: 22px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface-subtle);
  }

  html.simplecard-p2p-theme .preview-card {
    aspect-ratio: auto !important;
    padding: 24px !important;
    text-align: center !important;
  }

  html.simplecard-p2p-theme .preview-card:hover {
    transform: none !important;
    box-shadow: none !important;
  }

  html.simplecard-p2p-theme .preview-open-btn {
    min-height: 52px;
    border-radius: 12px;
  }

  html.simplecard-p2p-theme .stats-layout,
  html.simplecard-p2p-theme #editor-tab-qr,
  html.simplecard-p2p-theme #editor-tab-more {
    max-width: min(860px, calc(100vw - var(--desktop-sidebar-width) - 80px));
    margin-right: auto;
    margin-left: auto;
  }

  html.simplecard-p2p-theme body.landing-shell .page-main {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 40px !important;
  }

  html.simplecard-p2p-theme body.landing-shell .hero {
    display: grid !important;
    grid-template-columns: minmax(0, 540px) minmax(360px, 460px);
    grid-template-areas:
      "title card"
      "sub card"
      "cta card";
    column-gap: 64px;
    row-gap: 0;
    align-items: center !important;
    align-content: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: min(1064px, calc(100vw - var(--desktop-sidebar-width) - 96px)) !important;
    height: auto !important;
    min-height: min(720px, calc(var(--app-content-available-height) - 64px)) !important;
    padding: 0 !important;
    text-align: left !important;
  }

  html.simplecard-p2p-theme body.landing-shell .hero-title {
    grid-area: title;
    max-width: 560px !important;
    margin: 0 0 22px !important;
    font-size: clamp(52px, 5vw, 66px) !important;
    line-height: .98 !important;
    text-align: left !important;
    align-self: end;
  }

  html.simplecard-p2p-theme body.landing-shell .hero-card-preview {
    grid-area: card;
    width: min(100%, 460px) !important;
    margin: 0 !important;
    border-radius: 14px !important;
    align-self: center;
  }

  html.simplecard-p2p-theme body.landing-shell .hero-sub {
    grid-area: sub;
    max-width: 460px !important;
    margin: 0 !important;
    text-align: left !important;
    font-size: 18px !important;
    line-height: 1.5 !important;
    align-self: start;
  }

  html.simplecard-p2p-theme body.landing-shell .hero-cta {
    grid-area: cta;
    width: auto !important;
    max-width: none !important;
    margin-top: 28px !important;
    display: flex !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    align-self: start;
  }

  html.simplecard-p2p-theme body.landing-shell .hero-btn {
    width: auto !important;
    min-width: 230px;
    min-height: 56px;
    padding-right: 24px !important;
    padding-left: 24px !important;
    border-radius: 12px !important;
  }

  html.simplecard-p2p-theme body.landing-shell .hero-btn-secondary {
    min-width: 210px;
  }
}
