:root {
  --ux-bg: #fff7f2;
  --ux-surface: #ffffff;
  --ux-ink: #2f2420;
  --ux-sub: #6f625c;
  --ux-line: #f2dfce;
  --ux-brand: #ffcb48;
  --ux-brand-strong: #f7b80a;
  --ux-ok: #167e66;
  --ux-shadow: 0 10px 26px rgba(85, 49, 22, 0.08);
  --ux-radius: 14px;
  --ux-vh: 1vh;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body.ux-subagent-body {
  color: var(--ux-ink);
  line-height: 1.5;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overscroll-behavior-y: contain;
}

body.ux-subagent-body main {
  min-height: calc(var(--ux-vh, 1vh) * 100);
}

.ux-stable-card {
  background: var(--ux-surface);
  border: 1px solid var(--ux-line);
  border-radius: var(--ux-radius);
  box-shadow: var(--ux-shadow);
}

.ux-subagent-body .glass-card,
.ux-subagent-body .rounded-2xl,
.ux-subagent-body .rounded-3xl {
  will-change: auto;
  backface-visibility: hidden;
}

.ux-subagent-body button,
.ux-subagent-body [role="button"],
.ux-subagent-body a {
  -webkit-tap-highlight-color: transparent;
}

.ux-subagent-body button {
  min-height: 44px;
}

.ux-subagent-body input,
.ux-subagent-body select,
.ux-subagent-body textarea {
  border-radius: 12px;
  border-color: #e7e7e7;
}

.ux-subagent-body input:focus,
.ux-subagent-body select:focus,
.ux-subagent-body textarea:focus,
.ux-subagent-body button:focus,
.ux-subagent-body a:focus {
  outline: 0;
}

.ux-subagent-body :focus-visible {
  box-shadow: 0 0 0 3px rgba(255, 203, 72, 0.35);
  border-radius: 12px;
}

.ux-subagent-body .ux-cta {
  background: linear-gradient(180deg, var(--ux-brand), var(--ux-brand-strong));
  color: #2f1f0f;
  font-weight: 800;
  border: 0;
  border-radius: 12px;
}

.ux-subagent-body .ux-safe-bottom {
  padding-bottom: max(14px, env(safe-area-inset-bottom));
}

.ux-subagent-body .ux-muted {
  color: var(--ux-sub);
}

.ux-subagent-body .ux-status-ok {
  color: var(--ux-ok);
}

@media (max-width: 420px) {
  .ux-subagent-body {
    font-size: 15px;
  }
}

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