/*
 * Global AIPC visual compatibility layer.
 * Presentation only: do not add layout, sizing, spacing, positioning, or overflow rules here.
 */
:root {
  --aipc-site-bg: #f7f7f4;
  --aipc-site-fg: #26251e;
  --aipc-site-fg-2: #3b3a33;
  --aipc-site-muted: color-mix(in oklab, var(--aipc-site-fg) 58%, transparent);
  --aipc-site-faint: color-mix(in oklab, var(--aipc-site-fg) 40%, transparent);
  --aipc-site-card: #f2f1ed;
  --aipc-site-card-2: #ebeae5;
  --aipc-site-card-3: #e6e5e0;
  --aipc-site-border: color-mix(in oklab, var(--aipc-site-fg) 12%, transparent);
  --aipc-site-border-strong: color-mix(in oklab, var(--aipc-site-fg) 22%, transparent);
  --aipc-site-accent: #f54e00;
  --aipc-site-accent-hover: #d94400;
  --aipc-site-accent-soft: color-mix(in oklab, var(--aipc-site-accent) 12%, transparent);
  --aipc-site-button-bg: var(--aipc-site-fg);
  --aipc-site-button-text: var(--aipc-site-bg);
  --aipc-site-button-border: var(--aipc-site-fg);
  --aipc-site-button-hover-bg: var(--aipc-site-fg-2);
  --aipc-site-button-hover-text: var(--aipc-site-bg);
  --aipc-site-button-hover-border: var(--aipc-site-fg-2);
  --aipc-site-button-secondary-bg: transparent;
  --aipc-site-button-secondary-text: var(--aipc-site-fg);
  --aipc-site-button-secondary-border: var(--aipc-site-border-strong);
  --aipc-site-button-secondary-hover-bg: var(--aipc-site-card);
  --aipc-site-button-radius: 999px;
  --aipc-site-button-shadow: 0 6px 16px var(--aipc-site-border);
  --aipc-site-success: #1f8a65;
  --aipc-site-success-soft: color-mix(in oklab, var(--aipc-site-success) 13%, transparent);
  --aipc-site-warning: #a56510;
  --aipc-site-warning-soft: color-mix(in oklab, var(--aipc-site-warning) 14%, transparent);
  --aipc-site-danger: #cf2d56;
  --aipc-site-danger-soft: color-mix(in oklab, var(--aipc-site-danger) 12%, transparent);
  --aipc-site-info: #155dfc;
  --aipc-site-info-soft: color-mix(in oklab, var(--aipc-site-info) 11%, transparent);
  --aipc-site-focus-ring: 0 0 0 3px color-mix(in oklab, var(--aipc-site-accent) 18%, transparent);
  --aipc-site-radius: 8px;
  --aipc-site-radius-sm: 6px;
  --aipc-site-shadow: 0 24px 56px -32px color-mix(in oklab, var(--aipc-site-fg) 22%, transparent);
  --aipc-site-font: "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Microsoft YaHei", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --aipc-site-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  color-scheme: light;
}

.dark {
  --aipc-site-bg: #14120b;
  --aipc-site-fg: #edecec;
  --aipc-site-fg-2: #d7d6d5;
  --aipc-site-muted: color-mix(in oklab, var(--aipc-site-fg) 62%, transparent);
  --aipc-site-faint: color-mix(in oklab, var(--aipc-site-fg) 42%, transparent);
  --aipc-site-card: #1b1913;
  --aipc-site-card-2: #201e18;
  --aipc-site-card-3: #26241e;
  --aipc-site-border: color-mix(in oklab, var(--aipc-site-fg) 13%, transparent);
  --aipc-site-border-strong: color-mix(in oklab, var(--aipc-site-fg) 24%, transparent);
  --aipc-site-accent-hover: #ff6a24;
  --aipc-site-button-bg: var(--aipc-site-fg);
  --aipc-site-button-text: var(--aipc-site-bg);
  --aipc-site-button-border: var(--aipc-site-fg);
  --aipc-site-button-hover-bg: var(--aipc-site-fg-2);
  --aipc-site-button-hover-text: var(--aipc-site-bg);
  --aipc-site-button-hover-border: var(--aipc-site-fg-2);
  --aipc-site-button-shadow: 0 6px 16px rgba(0, 0, 0, 0.28);
  --aipc-site-shadow: 0 24px 64px -30px rgba(0, 0, 0, 0.62);
  color-scheme: dark;
}

html {
  background: var(--aipc-site-bg);
}

body {
  background: var(--aipc-site-bg) !important;
  color: var(--aipc-site-fg) !important;
  font-family: var(--aipc-site-font);
  letter-spacing: 0;
}

body > .flex.min-h-screen,
.SVELTE_HYDRATER.contents {
  background: transparent;
}

header.border-b {
  border-color: var(--aipc-site-border) !important;
  background: color-mix(in oklab, var(--aipc-site-bg) 94%, transparent);
  box-shadow: 0 1px 0 color-mix(in oklab, var(--aipc-site-fg) 4%, transparent);
}

header a,
header button {
  color: var(--aipc-site-fg);
  transition: color 0.16s ease, background-color 0.16s ease, border-color 0.16s ease;
}

a {
  text-decoration-color: color-mix(in oklab, currentColor 42%, transparent);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

header a:hover,
header button:hover {
  color: color-mix(in oklab, var(--aipc-site-fg) 75%, transparent) !important;
}

a:hover {
  text-decoration-color: currentColor;
}

.bg-white,
.bg-gray-50,
.bg-gray-100,
.dark .bg-white,
.dark .bg-gray-50,
.dark .bg-gray-100 {
  background-color: var(--aipc-site-card) !important;
}

.bg-gray-200,
.dark .bg-gray-800,
.dark .bg-gray-900 {
  background-color: var(--aipc-site-card-2) !important;
}

.dark .bg-gray-950 {
  background-color: var(--aipc-site-bg) !important;
}

.from-gray-50,
.from-gray-100,
.from-indigo-100,
.from-purple-50,
.from-blue-50 {
  --tw-gradient-from: var(--aipc-site-card) var(--tw-gradient-from-position) !important;
  --tw-gradient-to: color-mix(in oklab, var(--aipc-site-card) 0%, transparent) var(--tw-gradient-to-position) !important;
}

.via-white,
.via-orange-50 {
  --tw-gradient-stops: var(--tw-gradient-from), var(--aipc-site-card-2) var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
}

.to-white,
.to-gray-100 {
  --tw-gradient-to: var(--aipc-site-bg) var(--tw-gradient-to-position) !important;
}

.text-gray-950,
.text-gray-900,
.text-gray-800,
.text-gray-700,
.text-black,
.dark .text-gray-950,
.dark .text-gray-900,
.dark .text-gray-800,
.dark .text-gray-700,
.dark .text-black {
  color: var(--aipc-site-fg) !important;
}

.text-gray-600,
.text-gray-500,
.text-gray-400,
.dark .text-gray-600,
.dark .text-gray-500,
.dark .text-gray-400 {
  color: var(--aipc-site-muted) !important;
}

.text-gray-300,
.text-gray-200,
.dark .text-gray-300,
.dark .text-gray-200 {
  color: var(--aipc-site-fg-2) !important;
}

.text-indigo-500,
.text-indigo-600,
.text-indigo-700,
.text-purple-500,
.text-purple-600,
.text-purple-700,
.text-blue-500,
.text-blue-600,
.text-blue-700 {
  color: var(--aipc-site-accent) !important;
}

.text-green-500,
.text-green-600,
.text-green-700 {
  color: var(--aipc-site-success) !important;
}

.text-yellow-500,
.text-yellow-600,
.text-yellow-700,
.text-orange-500,
.text-orange-600,
.text-orange-700 {
  color: var(--aipc-site-warning) !important;
}

.text-red-500,
.text-red-600,
.text-red-700,
.form-error,
.errorlist {
  color: var(--aipc-site-danger) !important;
}

.border,
.border-gray-100,
.border-gray-200,
.border-gray-300,
.dark .border-gray-700,
.dark .border-gray-800,
.divide-gray-100 > :not([hidden]) ~ :not([hidden]),
.divide-gray-200 > :not([hidden]) ~ :not([hidden]),
.dark .divide-gray-700 > :not([hidden]) ~ :not([hidden]),
hr {
  border-color: var(--aipc-site-border) !important;
}

.border-indigo-500,
.border-indigo-600,
.border-blue-500,
.border-blue-600,
.focus\:border-indigo-500:focus,
.focus\:border-blue-500:focus {
  border-color: var(--aipc-site-accent) !important;
}

.rounded-3xl,
.rounded-2xl,
.rounded-xl,
.rounded-lg {
  border-radius: var(--aipc-site-radius) !important;
}

.rounded-md {
  border-radius: var(--aipc-site-radius-sm) !important;
}

.shadow,
.shadow-sm,
.shadow-md,
.shadow-lg,
.shadow-xl,
.shadow-2xl,
.hover\:shadow-alternate:hover {
  box-shadow: var(--aipc-site-shadow) !important;
}

.btn,
.button,
button.btn,
a.btn,
button[type="submit"]:not(.hui-language-option),
input[type="submit"],
a.bg-gray-900,
button.bg-gray-900,
.dark a.bg-gray-900,
.dark button.bg-gray-900,
.bg-indigo-600,
.bg-blue-600,
.bg-purple-600 {
  border-color: var(--aipc-site-button-border) !important;
  border-radius: var(--aipc-site-button-radius);
  background: var(--aipc-site-button-bg) !important;
  color: var(--aipc-site-button-text) !important;
  box-shadow: none;
  transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}

.btn:hover,
.button:hover,
button.btn:hover,
a.btn:hover,
button[type="submit"]:not(.hui-language-option):hover,
input[type="submit"]:hover,
a.bg-gray-900:hover,
button.bg-gray-900:hover,
.dark a.bg-gray-900:hover,
.dark button.bg-gray-900:hover,
.hover\:bg-indigo-700:hover,
.hover\:bg-blue-700:hover,
.hover\:bg-purple-700:hover {
  border-color: var(--aipc-site-button-hover-border) !important;
  background: var(--aipc-site-button-hover-bg) !important;
  color: var(--aipc-site-button-hover-text) !important;
  box-shadow: var(--aipc-site-button-shadow) !important;
}

.mobile-site-menu .btn > svg {
  color: #fff !important;
}

.dark .mobile-site-menu .btn > svg {
  color: #000 !important;
}

.btn--ghost,
.btn-secondary,
.button-secondary {
  border-color: var(--aipc-site-button-secondary-border) !important;
  border-radius: var(--aipc-site-button-radius);
  background: var(--aipc-site-button-secondary-bg) !important;
  color: var(--aipc-site-button-secondary-text) !important;
  box-shadow: none !important;
}

.btn--ghost:hover,
.btn-secondary:hover,
.button-secondary:hover {
  border-color: var(--aipc-site-button-secondary-border) !important;
  background: var(--aipc-site-button-secondary-hover-bg) !important;
  color: var(--aipc-site-button-secondary-text) !important;
  box-shadow: none !important;
}

button:disabled,
input:disabled,
select:disabled,
textarea:disabled,
.disabled {
  border-color: var(--aipc-site-border) !important;
  background: var(--aipc-site-card-2) !important;
  color: var(--aipc-site-faint) !important;
  box-shadow: none !important;
  opacity: 0.72;
}

input:not([type="checkbox"]):not([type="radio"]),
textarea,
select,
.form-input,
.form-select,
.form-textarea {
  border-color: var(--aipc-site-border-strong) !important;
  border-radius: var(--aipc-site-radius-sm) !important;
  background: var(--aipc-site-card) !important;
  color: var(--aipc-site-fg) !important;
  box-shadow: inset 0 1px 0 color-mix(in oklab, #fff 28%, transparent) !important;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease;
}

input::placeholder,
textarea::placeholder {
  color: var(--aipc-site-faint) !important;
  opacity: 1;
}

input:focus,
textarea:focus,
select:focus,
.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  border-color: var(--aipc-site-accent) !important;
  box-shadow: var(--aipc-site-focus-ring) !important;
  outline-color: transparent;
}

button:focus-visible,
a:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--aipc-site-fg);
  outline-offset: 0.3ch;
}

input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--aipc-site-accent);
  border-color: var(--aipc-site-border-strong) !important;
  background-color: var(--aipc-site-card) !important;
  color: var(--aipc-site-accent) !important;
}

input[type="checkbox"]:checked,
input[type="radio"]:checked {
  border-color: var(--aipc-site-accent) !important;
  background-color: var(--aipc-site-accent) !important;
  color: var(--aipc-site-accent) !important;
}

input[type="checkbox"]:checked {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0z'/%3E%3C/svg%3E") !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
}

table,
.billing-table {
  border-color: var(--aipc-site-border) !important;
  background: var(--aipc-site-card) !important;
  color: var(--aipc-site-fg);
}

thead,
.modal-header {
  background: var(--aipc-site-card-2) !important;
  color: var(--aipc-site-fg) !important;
}

tbody tr,
td,
th {
  border-color: var(--aipc-site-border) !important;
}

tbody tr:hover {
  background: color-mix(in oklab, var(--aipc-site-card-2) 72%, transparent);
}

.modal-content,
.agreement-modal,
.dialog,
[role="dialog"],
.dropdown-menu,
.dropdown-content,
[role="menu"],
.user-box {
  border-color: var(--aipc-site-border) !important;
  border-radius: var(--aipc-site-radius) !important;
  background: var(--aipc-site-card) !important;
  color: var(--aipc-site-fg) !important;
  box-shadow: var(--aipc-site-shadow) !important;
}

.dropdown-menu a:hover,
.dropdown-content a:hover,
[role="menu"] a:hover,
[role="menuitem"]:hover {
  background: var(--aipc-site-card-2) !important;
  color: var(--aipc-site-fg) !important;
}

.alert,
.message,
.messages li {
  border-color: var(--aipc-site-border) !important;
  border-radius: var(--aipc-site-radius-sm) !important;
  background: var(--aipc-site-card-2) !important;
  color: var(--aipc-site-fg) !important;
}

.alert-success,
.message.success,
.bg-green-50,
.bg-green-100 {
  border-color: color-mix(in oklab, var(--aipc-site-success) 35%, transparent) !important;
  background: var(--aipc-site-success-soft) !important;
  color: var(--aipc-site-success) !important;
}

.alert-warning,
.message.warning,
.bg-yellow-50,
.bg-yellow-100,
.bg-orange-50,
.bg-orange-100 {
  border-color: color-mix(in oklab, var(--aipc-site-warning) 35%, transparent) !important;
  background: var(--aipc-site-warning-soft) !important;
  color: var(--aipc-site-warning) !important;
}

.alert-danger,
.alert-error,
.message.error,
.bg-red-50,
.bg-red-100 {
  border-color: color-mix(in oklab, var(--aipc-site-danger) 35%, transparent) !important;
  background: var(--aipc-site-danger-soft) !important;
  color: var(--aipc-site-danger) !important;
}

.alert-info,
.message.info,
.bg-blue-50,
.bg-blue-100,
.bg-indigo-50,
.bg-indigo-100,
.bg-purple-50,
.bg-purple-100 {
  border-color: color-mix(in oklab, var(--aipc-site-info) 28%, transparent) !important;
  background: var(--aipc-site-info-soft) !important;
  color: var(--aipc-site-info) !important;
}

.badge,
[class*="badge"] {
  border-color: var(--aipc-site-border) !important;
  border-radius: var(--aipc-site-radius-sm) !important;
  background: var(--aipc-site-card-2) !important;
  color: var(--aipc-site-muted) !important;
}

.pagination a,
.pagination button,
.page-link {
  border-color: var(--aipc-site-border) !important;
  background: var(--aipc-site-card) !important;
  color: var(--aipc-site-fg) !important;
}

.pagination a:hover,
.pagination button:hover,
.page-link:hover {
  border-color: var(--aipc-site-border-strong) !important;
  background: var(--aipc-site-card-2) !important;
  color: var(--aipc-site-fg) !important;
}

.pagination .active,
.page-item.active .page-link {
  border-color: var(--aipc-site-accent) !important;
  background: var(--aipc-site-accent-soft) !important;
  color: var(--aipc-site-accent) !important;
}

.hui-language-switch,
.theme-toggle-button {
  border-color: var(--aipc-site-border) !important;
  background: color-mix(in oklab, var(--aipc-site-card) 82%, transparent) !important;
  color: var(--aipc-site-fg) !important;
}

.hui-language-option {
  border-color: transparent !important;
  background: transparent !important;
  color: var(--aipc-site-muted) !important;
  box-shadow: none !important;
}

.hui-language-option.is-active {
  background: var(--aipc-site-button-bg) !important;
  color: var(--aipc-site-button-text) !important;
}

.hui-language-option:hover,
.theme-toggle-button:hover {
  background: var(--aipc-site-card-3) !important;
  color: var(--aipc-site-fg) !important;
}

pre,
code,
kbd,
samp,
.bgcolor {
  border-color: var(--aipc-site-border) !important;
  background: var(--aipc-site-card-2) !important;
  color: var(--aipc-site-fg) !important;
  font-family: var(--aipc-site-mono);
}

blockquote {
  border-color: var(--aipc-site-accent) !important;
  color: var(--aipc-site-muted);
}

::selection {
  background: var(--aipc-site-accent-soft);
  color: var(--aipc-site-fg);
}

::-webkit-scrollbar-track {
  background: var(--aipc-site-bg);
}

::-webkit-scrollbar-thumb {
  border-color: var(--aipc-site-bg);
  border-radius: var(--aipc-site-radius-sm);
  background: var(--aipc-site-card-3);
}

::-webkit-scrollbar-thumb:hover {
  background: color-mix(in oklab, var(--aipc-site-fg) 28%, var(--aipc-site-card-3));
}

.account-sidebar {
  background: transparent;
  border: 0;
  border-right: 1px solid var(--aipc-site-border);
  border-radius: 0;
  box-shadow: none;
}

.account-sidebar__nav {
  border-top: 1px solid var(--aipc-site-border);
}

.account-sidebar__item {
  border-left: 2px solid transparent;
  background: transparent;
  color: var(--aipc-site-muted);
  transition: color 0.16s ease, border-color 0.16s ease;
}

.account-sidebar__item:hover {
  border-left-color: var(--aipc-site-border-strong);
  background: transparent;
  color: var(--aipc-site-fg);
}

.account-sidebar__item.is-active {
  border-left-color: var(--aipc-site-accent);
  background: transparent;
  color: var(--aipc-site-fg);
  font-weight: 600;
}

.account-sidebar__item:focus-visible {
  outline: 2px solid var(--aipc-site-fg);
  outline-offset: -2px;
}

@media (max-width: 767px) {
  .account-sidebar {
    border-right: 0;
    border-bottom: 1px solid var(--aipc-site-border);
  }
}

@media (prefers-reduced-motion: reduce) {
  header a,
  header button,
  .btn,
  .button,
  input,
  textarea,
  select {
    transition-duration: 0.01ms !important;
  }
}