/* OpenClaw skin overlay for piiq.gxwx8.com (proxy-injected, no NewAPI source patch) */
:root.openclaw-skin {
  --oc-red-1: #ef4444;
  --oc-red-2: #dc2626;
  --oc-red-3: #b91c1c;
  --oc-red-soft: #fff1f2;
  --oc-line: #fecaca;
  --oc-text: #111827;
  --oc-sub: #6b7280;

  --semi-color-primary: var(--oc-red-1);
  --semi-color-primary-hover: var(--oc-red-2);
  --semi-color-primary-active: var(--oc-red-3);
  --semi-color-link: var(--oc-red-1);
  --semi-color-focus-border: rgba(239, 68, 68, 0.48);
}

html.openclaw-skin,
html.openclaw-skin body {
  background:
    radial-gradient(circle at 9% 8%, rgba(239, 68, 68, 0.12), transparent 33%),
    radial-gradient(circle at 89% 11%, rgba(249, 115, 22, 0.09), transparent 29%),
    linear-gradient(180deg, #fff7f7, #ffffff 42%, #fff7ed);
  color: var(--oc-text);
}

html.openclaw-skin .semi-layout-header,
html.openclaw-skin [class*="bg-white/75"] {
  background: rgba(255, 255, 255, 0.86) !important;
  border-bottom: 1px solid var(--oc-line);
  box-shadow: 0 8px 20px rgba(239, 68, 68, 0.10);
  backdrop-filter: blur(10px);
}

html.openclaw-skin .semi-button.semi-button-primary {
  background: linear-gradient(135deg, var(--oc-red-1), var(--oc-red-2)) !important;
  border-color: var(--oc-red-2) !important;
  box-shadow: 0 8px 18px rgba(239, 68, 68, 0.34);
}

html.openclaw-skin .semi-button.semi-button-primary:hover {
  background: linear-gradient(135deg, var(--oc-red-2), var(--oc-red-3)) !important;
}

html.openclaw-skin .semi-button.semi-button-light,
html.openclaw-skin .semi-button.semi-button-tertiary,
html.openclaw-skin .semi-button.semi-button-borderless {
  border-color: #fda4af !important;
}

html.openclaw-skin .semi-input-wrapper,
html.openclaw-skin .semi-select,
html.openclaw-skin .semi-input,
html.openclaw-skin input,
html.openclaw-skin textarea {
  border-color: var(--oc-line) !important;
}

html.openclaw-skin .semi-input-wrapper:focus-within,
html.openclaw-skin .semi-select:focus-within,
html.openclaw-skin input:focus,
html.openclaw-skin textarea:focus {
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.20) !important;
  border-color: #f87171 !important;
}

html.openclaw-skin .semi-card,
html.openclaw-skin [class*="semi-card"],
html.openclaw-skin [class*="rounded"],
html.openclaw-skin [class*="shadow"] {
  border-color: #fecaca;
}

html.openclaw-skin .semi-typography,
html.openclaw-skin .text-semi-color-text-0 {
  color: var(--oc-text) !important;
}

html.openclaw-skin .text-semi-color-text-1,
html.openclaw-skin .text-semi-color-text-2 {
  color: var(--oc-sub) !important;
}

html.openclaw-skin .blur-ball {
  filter: saturate(118%) hue-rotate(-14deg);
  opacity: 0.55;
}

html.openclaw-skin .semi-avatar.semi-avatar-red {
  box-shadow: 0 0 0 2px #fee2e2;
}

@media (prefers-reduced-motion: reduce) {
  html.openclaw-skin *,
  html.openclaw-skin *::before,
  html.openclaw-skin *::after {
    transition: none !important;
    animation: none !important;
  }
}