/* Fox API block-world theme. Applied after Sub2API CSS; keeps its form and account behavior. */
:root {
  --fox-bg: #e6ead9; --fox-panel: #f2f1df; --fox-inset: #e1e7d1;
  --fox-text: #243b2c; --fox-muted: #50644a; --fox-line: #91a176;
  --fox-edge: #526546; --fox-accent: #435f29; --fox-shadow: #2b3e3426;
  color-scheme: light;
}
:root.dark {
  --fox-bg: #192722; --fox-panel: #26372d; --fox-inset: #17271f;
  --fox-text: #eee9d5; --fox-muted: #b2c0a5; --fox-line: #53694b;
  --fox-edge: #102017; --fox-accent: #bcdd8d; --fox-shadow: #0d191a;
  color-scheme: dark;
}
html, body { background: var(--fox-bg) !important; color: var(--fox-text) !important; }
body, button, input, select, textarea { font-family: ui-monospace, 'SFMono-Regular', Consolas, 'PingFang SC', 'Microsoft YaHei', monospace; }
body { background-image: linear-gradient(45deg,#63825208 25%,transparent 25%,transparent 75%,#63825208 75%),linear-gradient(45deg,#63825208 25%,transparent 25%,transparent 75%,#63825208 75%) !important; background-size: 24px 24px !important; background-position: 0 0,12px 12px !important; }
::selection { background: #bed787; color: #162c1e; }
:focus-visible { outline: 2px dashed var(--fox-accent) !important; outline-offset: 3px; }
.card, .card-glass, [role='dialog'], .modal-content {
  background: var(--fox-panel) !important; border: 2px solid var(--fox-line) !important;
  border-radius: 0 !important; box-shadow: inset 2px 2px #b0c29426,4px 4px var(--fox-shadow) !important;
  backdrop-filter: none !important;
}
.btn, .input, input:not([type='checkbox']):not([type='radio']), select, textarea { border-radius: 0 !important; }
.btn { border: 2px solid var(--fox-edge) !important; box-shadow: inset 2px 2px #ffffff30,inset -2px -2px #0003,3px 3px var(--fox-shadow) !important; font-weight: 700; min-height: 40px; transition: background-color .12s,transform .12s !important; }
.btn:active:not(:disabled) { transform: translate(1px,1px); box-shadow: inset 2px 2px #0003 !important; }
.btn:disabled { cursor: not-allowed; }
.btn-primary { background: #8eb74d !important; color: #172d1d !important; }
.btn-primary:hover:not(:disabled) { background: #a2c766 !important; }
.btn-secondary, .btn-ghost { background: var(--fox-inset) !important; color: var(--fox-text) !important; }
.input, input:not([type='checkbox']):not([type='radio']), textarea, select { color: var(--fox-text) !important; background-color: var(--fox-inset) !important; border-color: var(--fox-line) !important; }
.input::placeholder, input::placeholder, textarea::placeholder { color: var(--fox-muted) !important; opacity: .78; }
.input-label { color: var(--fox-text) !important; }
input[type='checkbox'], input[type='radio'] { accent-color: #8bb14c; }
[class*='rounded-lg']:not(.animate-spin), [class*='rounded-xl']:not(.animate-spin), [class*='rounded-2xl']:not(.animate-spin), [class*='rounded-3xl']:not(.animate-spin) { border-radius: 0 !important; }
[class~='text-gradient'] { background: none !important; color: var(--fox-accent) !important; -webkit-text-fill-color: var(--fox-accent); }
[class*='shadow-glass'] { box-shadow: 4px 4px var(--fox-shadow) !important; }
img[src='/logo.svg'], img[src$='/fox-logo.svg'] { content: url('/fox-ui/pixel-20261009-2/pixel-fox.svg'); image-rendering: pixelated; }
aside, header { border-color: var(--fox-line) !important; }
/* Auth composition uses the existing layout and keeps the live form intact. */
.min-h-screen:has(> .max-w-md > .card-glass) { padding: 48px 24px !important; }
.min-h-screen:has(> .max-w-md > .card-glass) > .absolute { background: var(--fox-bg) !important; }
.min-h-screen:has(> .max-w-md > .card-glass) > .pointer-events-none { display: none; }
.max-w-md:has(> .card-glass) {
  max-width: 1050px !important; display: grid; grid-template-columns: 1fr 1fr; gap: 0 42px;
  padding: 40px; border: 3px solid var(--fox-line); background: var(--fox-panel);
  box-shadow: inset 3px 3px #b0c29426,6px 6px var(--fox-shadow);
}
.max-w-md:has(> .card-glass) > .mb-8 { text-align: left; margin-bottom: 0; align-self: start; }
.max-w-md:has(> .card-glass) > .mb-8::after {
  content: ''; display: block; aspect-ratio: 760/650; width: 100%; margin-top: 15px;
  background: url('/fox-ui/pixel-20261009-2/block-world.svg') center / contain no-repeat; image-rendering: pixelated;
}
.max-w-md:has(> .card-glass) > .mb-8 > .inline-flex { width: 48px; height: 48px; border-radius: 0 !important; box-shadow: none !important; }
.max-w-md:has(> .card-glass) > .card-glass { grid-column: 2; grid-row: 1/4; align-self: center; padding: 28px; }
.max-w-md:has(> .card-glass) > .mt-6 { margin-top: 0; text-align: left; }
.max-w-md:has(> .card-glass) > .mt-8 { text-align: left; margin-top: 15px; }
@media (max-width: 760px) {
  .min-h-screen:has(> .max-w-md > .card-glass) { padding: 28px 18px !important; align-items: start !important; }
  .max-w-md:has(> .card-glass) { display: block; padding: 0; border: 0; background: transparent; box-shadow: none; max-width: 440px !important; }
  .max-w-md:has(> .card-glass) > .mb-8 { text-align: center; margin-bottom: 25px; }
  .max-w-md:has(> .card-glass) > .mb-8::after { display: none; }
  .max-w-md:has(> .card-glass) > .card-glass { padding: 24px; }
  .max-w-md:has(> .card-glass) > .mt-6, .max-w-md:has(> .card-glass) > .mt-8 { text-align: center; margin-top: 22px; }
}
@media (prefers-reduced-motion: reduce) { .btn { transition: none !important; } }
/* Utility colors are generated below to cover the installed Tailwind variants. */
.bg-dark-700 { background-color: var(--fox-panel) !important; }
.bg-gray-100 { background-color: var(--fox-bg) !important; }
.bg-gray-200 { background-color: var(--fox-panel) !important; }
.bg-gray-200\/60 { background-color: var(--fox-panel) !important; }
.bg-gray-200\/70 { background-color: var(--fox-panel) !important; }
.bg-gray-200\/80 { background-color: var(--fox-panel) !important; }
.bg-gray-300 { background-color: var(--fox-panel) !important; }
.bg-gray-400 { background-color: var(--fox-panel) !important; }
.bg-gray-50 { background-color: var(--fox-bg) !important; }
.bg-gray-50\/30 { background-color: var(--fox-bg) !important; }
.bg-gray-50\/40 { background-color: var(--fox-bg) !important; }
.bg-gray-50\/50 { background-color: var(--fox-bg) !important; }
.bg-gray-50\/60 { background-color: var(--fox-bg) !important; }
.bg-gray-50\/70 { background-color: var(--fox-bg) !important; }
.bg-gray-50\/80 { background-color: var(--fox-bg) !important; }
.bg-gray-700 { background-color: var(--fox-panel) !important; }
.bg-gray-800 { background-color: var(--fox-panel) !important; }
.bg-gray-800\/80 { background-color: var(--fox-panel) !important; }
.bg-gray-900 { background-color: var(--fox-bg) !important; }
.bg-gray-950 { background-color: var(--fox-bg) !important; }
.bg-gray-950\/60 { background-color: var(--fox-bg) !important; }
.bg-primary-100 { background-color: color-mix(in srgb, var(--fox-line) 100%, transparent) !important; }
.bg-primary-200\/50 { background-color: color-mix(in srgb, var(--fox-line) 50%, transparent) !important; }
.bg-primary-300\/10 { background-color: color-mix(in srgb, var(--fox-line) 10%, transparent) !important; }
.bg-primary-400 { background-color: color-mix(in srgb, #8eb74d 100%, transparent) !important; }
.bg-primary-400\/10 { background-color: color-mix(in srgb, #8eb74d 10%, transparent) !important; }
.bg-primary-400\/20 { background-color: color-mix(in srgb, #8eb74d 20%, transparent) !important; }
.bg-primary-50 { background-color: color-mix(in srgb, var(--fox-line) 100%, transparent) !important; }
.bg-primary-500 { background-color: color-mix(in srgb, #8eb74d 100%, transparent) !important; }
.bg-primary-500\/10 { background-color: color-mix(in srgb, #8eb74d 10%, transparent) !important; }
.bg-primary-500\/15 { background-color: color-mix(in srgb, #8eb74d 15%, transparent) !important; }
.bg-primary-50\/40 { background-color: color-mix(in srgb, var(--fox-line) 40%, transparent) !important; }
.bg-primary-50\/50 { background-color: color-mix(in srgb, var(--fox-line) 50%, transparent) !important; }
.bg-primary-50\/60 { background-color: color-mix(in srgb, var(--fox-line) 60%, transparent) !important; }
.bg-primary-50\/70 { background-color: color-mix(in srgb, var(--fox-line) 70%, transparent) !important; }
.bg-primary-50\/80 { background-color: color-mix(in srgb, var(--fox-line) 80%, transparent) !important; }
.bg-primary-600 { background-color: color-mix(in srgb, #8eb74d 100%, transparent) !important; }
.bg-primary-900\/10 { background-color: color-mix(in srgb, var(--fox-line) 10%, transparent) !important; }
.bg-slate-100 { background-color: var(--fox-bg) !important; }
.bg-slate-300 { background-color: var(--fox-panel) !important; }
.bg-slate-50 { background-color: var(--fox-bg) !important; }
.bg-slate-500\/10 { background-color: var(--fox-panel) !important; }
.bg-teal-100 { background-color: color-mix(in srgb, var(--fox-line) 100%, transparent) !important; }
.bg-teal-200\/60 { background-color: color-mix(in srgb, var(--fox-line) 60%, transparent) !important; }
.bg-teal-50 { background-color: color-mix(in srgb, var(--fox-line) 100%, transparent) !important; }
.bg-teal-500 { background-color: color-mix(in srgb, #8eb74d 100%, transparent) !important; }
.bg-teal-500\/10 { background-color: color-mix(in srgb, #8eb74d 10%, transparent) !important; }
.bg-white { background-color: var(--fox-panel) !important; }
.bg-white\/10 { background-color: var(--fox-panel) !important; }
.bg-white\/20 { background-color: var(--fox-panel) !important; }
.bg-white\/40 { background-color: var(--fox-panel) !important; }
.bg-white\/50 { background-color: var(--fox-panel) !important; }
.bg-white\/60 { background-color: var(--fox-panel) !important; }
.bg-white\/70 { background-color: var(--fox-panel) !important; }
.bg-white\/80 { background-color: var(--fox-panel) !important; }
.bg-white\/85 { background-color: var(--fox-panel) !important; }
.bg-white\/90 { background-color: var(--fox-panel) !important; }
.bg-white\/95 { background-color: var(--fox-panel) !important; }
.border-dark-600 { border-color: var(--fox-line) !important; }
.border-dark-700\/50 { border-color: var(--fox-line) !important; }
.border-gray-100 { border-color: var(--fox-line) !important; }
.border-gray-100\/50 { border-color: var(--fox-line) !important; }
.border-gray-100\/70 { border-color: var(--fox-line) !important; }
.border-gray-100\/80 { border-color: var(--fox-line) !important; }
.border-gray-200 { border-color: var(--fox-line) !important; }
.border-gray-200\/50 { border-color: var(--fox-line) !important; }
.border-gray-200\/60 { border-color: var(--fox-line) !important; }
.border-gray-200\/80 { border-color: var(--fox-line) !important; }
.border-gray-300 { border-color: var(--fox-line) !important; }
.border-gray-400 { border-color: var(--fox-line) !important; }
.border-gray-400\/70 { border-color: var(--fox-line) !important; }
.border-gray-50 { border-color: var(--fox-line) !important; }
.border-gray-700 { border-color: var(--fox-line) !important; }
.border-primary-100 { border-color: var(--fox-line) !important; }
.border-primary-100\/80 { border-color: var(--fox-line) !important; }
.border-primary-200 { border-color: var(--fox-line) !important; }
.border-primary-200\/80 { border-color: var(--fox-line) !important; }
.border-primary-300 { border-color: var(--fox-line) !important; }
.border-primary-400 { border-color: var(--fox-line) !important; }
.border-primary-500 { border-color: var(--fox-line) !important; }
.border-primary-600 { border-color: var(--fox-line) !important; }
.border-primary-600\/25 { border-color: var(--fox-line) !important; }
.border-slate-200 { border-color: var(--fox-line) !important; }
.border-slate-500\/30 { border-color: var(--fox-line) !important; }
.border-teal-500 { border-color: var(--fox-line) !important; }
.border-teal-500\/20 { border-color: var(--fox-line) !important; }
.border-teal-500\/30 { border-color: var(--fox-line) !important; }
.border-teal-500\/35 { border-color: var(--fox-line) !important; }
:root.dark .dark\:bg-dark-500 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-600 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-600\/70 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-700 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-700\/20 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-700\/30 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-700\/40 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-700\/50 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-700\/60 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-700\/70 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-700\/95 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-800 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-800\/30 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-800\/40 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-800\/50 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-800\/60 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-800\/70 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-800\/80 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-dark-900 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-dark-900\/20 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-dark-900\/30 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-dark-900\/40 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-dark-900\/50 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-dark-900\/60 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-dark-900\/70 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-dark-900\/90 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-dark-900\/95 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-dark-950 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-dark-950\/60 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-gray-500 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-gray-500\/20 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-gray-600 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-gray-700 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-gray-800 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-gray-800\/80 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-gray-900 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-gray-900\/30 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-primary-300 { background-color: color-mix(in srgb, var(--fox-line) 100%, transparent) !important; }
:root.dark .dark\:bg-primary-400\/10 { background-color: color-mix(in srgb, #8eb74d 10%, transparent) !important; }
:root.dark .dark\:bg-primary-500\/10 { background-color: color-mix(in srgb, #8eb74d 10%, transparent) !important; }
:root.dark .dark\:bg-primary-500\/15 { background-color: color-mix(in srgb, #8eb74d 15%, transparent) !important; }
:root.dark .dark\:bg-primary-600 { background-color: color-mix(in srgb, #8eb74d 100%, transparent) !important; }
:root.dark .dark\:bg-primary-800\/40 { background-color: color-mix(in srgb, var(--fox-line) 40%, transparent) !important; }
:root.dark .dark\:bg-primary-900\/10 { background-color: color-mix(in srgb, var(--fox-line) 10%, transparent) !important; }
:root.dark .dark\:bg-primary-900\/20 { background-color: color-mix(in srgb, var(--fox-line) 20%, transparent) !important; }
:root.dark .dark\:bg-primary-900\/25 { background-color: color-mix(in srgb, var(--fox-line) 25%, transparent) !important; }
:root.dark .dark\:bg-primary-900\/30 { background-color: color-mix(in srgb, var(--fox-line) 30%, transparent) !important; }
:root.dark .dark\:bg-primary-900\/40 { background-color: color-mix(in srgb, var(--fox-line) 40%, transparent) !important; }
:root.dark .dark\:bg-primary-950 { background-color: color-mix(in srgb, var(--fox-line) 100%, transparent) !important; }
:root.dark .dark\:bg-primary-950\/20 { background-color: color-mix(in srgb, var(--fox-line) 20%, transparent) !important; }
:root.dark .dark\:bg-primary-950\/40 { background-color: color-mix(in srgb, var(--fox-line) 40%, transparent) !important; }
:root.dark .dark\:bg-slate-500 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-slate-700 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-slate-800 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-slate-800\/50 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-slate-900 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-slate-900\/30 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-slate-950 { background-color: var(--fox-bg) !important; }
:root.dark .dark\:bg-teal-500\/10 { background-color: color-mix(in srgb, #8eb74d 10%, transparent) !important; }
:root.dark .dark\:bg-teal-500\/15 { background-color: color-mix(in srgb, #8eb74d 15%, transparent) !important; }
:root.dark .dark\:bg-teal-500\/80 { background-color: color-mix(in srgb, #8eb74d 80%, transparent) !important; }
:root.dark .dark\:bg-teal-800\/40 { background-color: color-mix(in srgb, var(--fox-line) 40%, transparent) !important; }
:root.dark .dark\:bg-teal-900 { background-color: color-mix(in srgb, var(--fox-line) 100%, transparent) !important; }
:root.dark .dark\:bg-teal-900\/20 { background-color: color-mix(in srgb, var(--fox-line) 20%, transparent) !important; }
:root.dark .dark\:bg-teal-900\/30 { background-color: color-mix(in srgb, var(--fox-line) 30%, transparent) !important; }
:root.dark .dark\:bg-teal-900\/40 { background-color: color-mix(in srgb, var(--fox-line) 40%, transparent) !important; }
:root.dark .dark\:bg-white { background-color: var(--fox-panel) !important; }
:root.dark .dark\:bg-white\/10 { background-color: var(--fox-panel) !important; }
:root.dark .dark\:border-dark-400 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-dark-500 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-dark-600 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-dark-600\/60 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-dark-700 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-dark-700\/50 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-dark-700\/60 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-dark-700\/70 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-dark-700\/80 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-dark-800 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-dark-800\/50 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-gray-500 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-gray-600 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-gray-800 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-primary-400 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-primary-400\/25 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-primary-400\/30 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-primary-500 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-primary-500\/20 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-primary-600 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-primary-700 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-primary-700\/50 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-primary-800 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-primary-800\/50 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-primary-900\/40 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-primary-900\/50 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-slate-700 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-teal-400 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-teal-500\/20 { border-color: var(--fox-line) !important; }
:root.dark .dark\:border-teal-500\/30 { border-color: var(--fox-line) !important; }
:root.dark .dark\:disabled\:hover\:text-dark-600:disabled:hover { color: var(--fox-muted) !important; }
:root.dark .dark\:disabled\:text-dark-600:disabled { color: var(--fox-muted) !important; }
:root.dark .dark\:focus-within\:border-primary-700:focus-within { border-color: var(--fox-line) !important; }
:root.dark .dark\:focus\:bg-dark-800:focus { background-color: var(--fox-panel) !important; }
:root.dark .dark\:focus\:bg-dark-900:focus { background-color: var(--fox-bg) !important; }
:root.dark .dark\:focus\:border-primary-500:focus { border-color: var(--fox-line) !important; }
:root.dark .dark\:focus\:border-primary-600:focus { border-color: var(--fox-line) !important; }
:root.dark .dark\:focus\:ring-primary-600:focus { --tw-ring-color: #8eb74d88 !important; }
:root.dark .dark\:focus\:ring-primary-900\/40:focus { --tw-ring-color: #8eb74d88 !important; }
:root.dark .dark\:focus\:text-primary-400:focus { color: var(--fox-accent) !important; }
:root.dark .dark\:from-dark-700 { background-image: none !important; }
:root.dark .dark\:from-dark-900 { background-image: none !important; }
:root.dark .dark\:from-dark-950 { background-image: none !important; }
:root.dark .dark\:from-primary-900\/20 { background-image: none !important; }
:root.dark .dark\:from-primary-900\/30 { background-image: none !important; }
:root.dark .dark\:from-primary-950\/40 { background-image: none !important; }
.group:hover :root.dark .dark\:group-hover\:bg-primary-500\/10 { background-color: color-mix(in srgb, #8eb74d 10%, transparent) !important; }
.group:hover :root.dark .dark\:group-hover\:ring-primary-500\/20 { --tw-ring-color: #8eb74d88 !important; }
.group:hover :root.dark .dark\:group-hover\:text-primary-200 { color: var(--fox-accent) !important; }
.group:hover :root.dark .dark\:group-hover\:text-primary-300 { color: var(--fox-accent) !important; }
:root.dark .dark\:hover\:bg-dark-500:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-dark-600:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-dark-700:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-dark-700\/30:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-dark-700\/40:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-dark-700\/50:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-dark-700\/60:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-dark-800:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-dark-800\/40:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-dark-800\/50:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-dark-800\/55:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-dark-800\/60:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-dark-800\/70:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-gray-200:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-gray-700:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-gray-800\/50:hover { background-color: var(--fox-panel) !important; }
:root.dark .dark\:hover\:bg-primary-500:hover { background-color: color-mix(in srgb, #8eb74d 100%, transparent) !important; }
:root.dark .dark\:hover\:bg-primary-800:hover { background-color: color-mix(in srgb, var(--fox-line) 100%, transparent) !important; }
:root.dark .dark\:hover\:bg-primary-900\/20:hover { background-color: color-mix(in srgb, var(--fox-line) 20%, transparent) !important; }
:root.dark .dark\:hover\:bg-primary-900\/30:hover { background-color: color-mix(in srgb, var(--fox-line) 30%, transparent) !important; }
:root.dark .dark\:hover\:bg-primary-900\/50:hover { background-color: color-mix(in srgb, var(--fox-line) 50%, transparent) !important; }
:root.dark .dark\:hover\:bg-teal-500:hover { background-color: color-mix(in srgb, #8eb74d 100%, transparent) !important; }
:root.dark .dark\:hover\:border-dark-400:hover { border-color: var(--fox-line) !important; }
:root.dark .dark\:hover\:border-dark-500:hover { border-color: var(--fox-line) !important; }
:root.dark .dark\:hover\:border-dark-600:hover { border-color: var(--fox-line) !important; }
:root.dark .dark\:hover\:border-gray-600:hover { border-color: var(--fox-line) !important; }
:root.dark .dark\:hover\:border-primary-400:hover { border-color: var(--fox-line) !important; }
:root.dark .dark\:hover\:border-primary-500:hover { border-color: var(--fox-line) !important; }
:root.dark .dark\:hover\:border-primary-500\/30:hover { border-color: var(--fox-line) !important; }
:root.dark .dark\:hover\:border-primary-700:hover { border-color: var(--fox-line) !important; }
:root.dark .dark\:hover\:border-primary-800:hover { border-color: var(--fox-line) !important; }
:root.dark .dark\:hover\:border-teal-500\/50:hover { border-color: var(--fox-line) !important; }
:root.dark .dark\:hover\:text-dark-200:hover { color: var(--fox-text) !important; }
:root.dark .dark\:hover\:text-dark-300:hover { color: var(--fox-muted) !important; }
:root.dark .dark\:hover\:text-dark-400:hover { color: var(--fox-muted) !important; }
:root.dark .dark\:hover\:text-gray-200:hover { color: var(--fox-text) !important; }
:root.dark .dark\:hover\:text-gray-300:hover { color: var(--fox-muted) !important; }
:root.dark .dark\:hover\:text-primary-200:hover { color: var(--fox-accent) !important; }
:root.dark .dark\:hover\:text-primary-300:hover { color: var(--fox-accent) !important; }
:root.dark .dark\:hover\:text-primary-400:hover { color: var(--fox-accent) !important; }
:root.dark .dark\:ring-primary-500\/20 { --tw-ring-color: #8eb74d88 !important; }
:root.dark .dark\:ring-primary-700\/50 { --tw-ring-color: #8eb74d88 !important; }
:root.dark .dark\:ring-primary-900 { --tw-ring-color: #8eb74d88 !important; }
:root.dark .dark\:ring-primary-900\/40 { --tw-ring-color: #8eb74d88 !important; }
:root.dark .dark\:text-dark-100 { color: var(--fox-text) !important; }
:root.dark .dark\:text-dark-200 { color: var(--fox-text) !important; }
:root.dark .dark\:text-dark-300 { color: var(--fox-muted) !important; }
:root.dark .dark\:text-dark-400 { color: var(--fox-muted) !important; }
:root.dark .dark\:text-dark-500 { color: var(--fox-muted) !important; }
:root.dark .dark\:text-dark-600 { color: var(--fox-muted) !important; }
:root.dark .dark\:text-dark-700 { color: var(--fox-text) !important; }
:root.dark .dark\:text-dark-800 { color: var(--fox-text) !important; }
:root.dark .dark\:text-gray-100 { color: var(--fox-text) !important; }
:root.dark .dark\:text-gray-200 { color: var(--fox-text) !important; }
:root.dark .dark\:text-gray-300 { color: var(--fox-muted) !important; }
:root.dark .dark\:text-gray-400 { color: var(--fox-muted) !important; }
:root.dark .dark\:text-gray-50 { color: var(--fox-text) !important; }
:root.dark .dark\:text-gray-500 { color: var(--fox-muted) !important; }
:root.dark .dark\:text-gray-600 { color: var(--fox-muted) !important; }
:root.dark .dark\:text-gray-900 { color: var(--fox-text) !important; }
:root.dark .dark\:text-primary-100 { color: var(--fox-accent) !important; }
:root.dark .dark\:text-primary-200 { color: var(--fox-accent) !important; }
:root.dark .dark\:text-primary-200\/80 { color: var(--fox-accent) !important; }
:root.dark .dark\:text-primary-300 { color: var(--fox-accent) !important; }
:root.dark .dark\:text-primary-400 { color: var(--fox-accent) !important; }
:root.dark .dark\:text-primary-400\/90 { color: var(--fox-accent) !important; }
:root.dark .dark\:text-primary-700 { color: var(--fox-accent) !important; }
:root.dark .dark\:text-primary-800 { color: var(--fox-accent) !important; }
:root.dark .dark\:text-slate-200 { color: var(--fox-text) !important; }
:root.dark .dark\:text-slate-300 { color: var(--fox-muted) !important; }
:root.dark .dark\:text-slate-400 { color: var(--fox-muted) !important; }
:root.dark .dark\:text-teal-200 { color: var(--fox-accent) !important; }
:root.dark .dark\:text-teal-300 { color: var(--fox-accent) !important; }
:root.dark .dark\:text-teal-400 { color: var(--fox-accent) !important; }
:root.dark .dark\:to-dark-600 { background-image: none !important; }
:root.dark .dark\:to-dark-700 { background-image: none !important; }
:root.dark .dark\:to-dark-800 { background-image: none !important; }
:root.dark .dark\:to-dark-950 { background-image: none !important; }
:root.dark .dark\:to-primary-800\/20 { background-image: none !important; }
:root.dark .dark\:via-dark-900 { background-image: none !important; }
.disabled\:hover\:text-gray-300:disabled:hover { color: var(--fox-muted) !important; }
.disabled\:text-gray-300:disabled { color: var(--fox-muted) !important; }
.disabled\:text-gray-400:disabled { color: var(--fox-muted) !important; }
.focus-within\:border-primary-300:focus-within { border-color: var(--fox-line) !important; }
.focus-within\:border-primary-500:focus-within { border-color: var(--fox-line) !important; }
.focus-within\:ring-primary-500:focus-within { --tw-ring-color: #8eb74d88 !important; }
.focus\:bg-white:focus { background-color: var(--fox-panel) !important; }
.focus\:border-primary-300:focus { border-color: var(--fox-line) !important; }
.focus\:border-primary-400:focus { border-color: var(--fox-line) !important; }
.focus\:border-primary-500:focus { border-color: var(--fox-line) !important; }
.focus\:ring-primary-100:focus { --tw-ring-color: #8eb74d88 !important; }
.focus\:ring-primary-300:focus { --tw-ring-color: #8eb74d88 !important; }
.focus\:ring-primary-400:focus { --tw-ring-color: #8eb74d88 !important; }
.focus\:ring-primary-500:focus { --tw-ring-color: #8eb74d88 !important; }
.focus\:ring-primary-500\/20:focus { --tw-ring-color: #8eb74d88 !important; }
.focus\:ring-primary-500\/30:focus { --tw-ring-color: #8eb74d88 !important; }
.focus\:ring-primary-500\/40:focus { --tw-ring-color: #8eb74d88 !important; }
.focus\:text-primary-600:focus { color: var(--fox-accent) !important; }
.from-gray-100 { background-image: none !important; }
.from-gray-50 { background-image: none !important; }
.from-gray-500 { background-image: none !important; }
.from-primary-400 { background-image: none !important; }
.from-primary-50 { background-image: none !important; }
.from-primary-500 { background-image: none !important; }
.from-primary-600 { background-image: none !important; }
.group:hover .group-hover\:bg-primary-50 { background-color: color-mix(in srgb, var(--fox-line) 100%, transparent) !important; }
.group:hover .group-hover\:border-gray-400 { border-color: var(--fox-line) !important; }
.group:hover .group-hover\:ring-primary-100 { --tw-ring-color: #8eb74d88 !important; }
.group:hover .group-hover\:text-primary-500 { color: var(--fox-accent) !important; }
.group:hover .group-hover\:text-primary-600 { color: var(--fox-accent) !important; }
.group:hover .group-hover\:text-primary-700 { color: var(--fox-accent) !important; }
.hover\:bg-gray-100:hover { background-color: var(--fox-bg) !important; }
.hover\:bg-gray-100\/80:hover { background-color: var(--fox-bg) !important; }
.hover\:bg-gray-200:hover { background-color: var(--fox-panel) !important; }
.hover\:bg-gray-200\/70:hover { background-color: var(--fox-panel) !important; }
.hover\:bg-gray-300:hover { background-color: var(--fox-panel) !important; }
.hover\:bg-gray-50:hover { background-color: var(--fox-bg) !important; }
.hover\:bg-gray-50\/40:hover { background-color: var(--fox-bg) !important; }
.hover\:bg-gray-50\/70:hover { background-color: var(--fox-bg) !important; }
.hover\:bg-gray-50\/80:hover { background-color: var(--fox-bg) !important; }
.hover\:bg-gray-600:hover { background-color: var(--fox-panel) !important; }
.hover\:bg-gray-700:hover { background-color: var(--fox-panel) !important; }
.hover\:bg-gray-800:hover { background-color: var(--fox-panel) !important; }
.hover\:bg-primary-100:hover { background-color: color-mix(in srgb, var(--fox-line) 100%, transparent) !important; }
.hover\:bg-primary-200:hover { background-color: color-mix(in srgb, var(--fox-line) 100%, transparent) !important; }
.hover\:bg-primary-50:hover { background-color: color-mix(in srgb, var(--fox-line) 100%, transparent) !important; }
.hover\:bg-primary-50\/50:hover { background-color: color-mix(in srgb, var(--fox-line) 50%, transparent) !important; }
.hover\:bg-primary-600:hover { background-color: color-mix(in srgb, #8eb74d 100%, transparent) !important; }
.hover\:bg-primary-700:hover { background-color: color-mix(in srgb, #8eb74d 100%, transparent) !important; }
.hover\:bg-slate-200:hover { background-color: var(--fox-panel) !important; }
.hover\:bg-teal-200:hover { background-color: color-mix(in srgb, var(--fox-line) 100%, transparent) !important; }
.hover\:bg-teal-600:hover { background-color: color-mix(in srgb, #8eb74d 100%, transparent) !important; }
.hover\:bg-white:hover { background-color: var(--fox-panel) !important; }
.hover\:bg-white\/10:hover { background-color: var(--fox-panel) !important; }
.hover\:bg-white\/60:hover { background-color: var(--fox-panel) !important; }
.hover\:border-gray-200:hover { border-color: var(--fox-line) !important; }
.hover\:border-gray-300:hover { border-color: var(--fox-line) !important; }
.hover\:border-gray-400:hover { border-color: var(--fox-line) !important; }
.hover\:border-primary-200:hover { border-color: var(--fox-line) !important; }
.hover\:border-primary-300:hover { border-color: var(--fox-line) !important; }
.hover\:border-primary-400:hover { border-color: var(--fox-line) !important; }
.hover\:border-primary-500:hover { border-color: var(--fox-line) !important; }
.hover\:border-teal-300:hover { border-color: var(--fox-line) !important; }
.hover\:from-primary-600:hover { background-image: none !important; }
.hover\:text-gray-500:hover { color: var(--fox-muted) !important; }
.hover\:text-gray-600:hover { color: var(--fox-muted) !important; }
.hover\:text-gray-700:hover { color: var(--fox-text) !important; }
.hover\:text-gray-900:hover { color: var(--fox-text) !important; }
.hover\:text-primary-500:hover { color: var(--fox-accent) !important; }
.hover\:text-primary-600:hover { color: var(--fox-accent) !important; }
.hover\:text-primary-700:hover { color: var(--fox-accent) !important; }
.hover\:text-primary-800:hover { color: var(--fox-accent) !important; }
.hover\:text-teal-700:hover { color: var(--fox-accent) !important; }
.hover\:to-primary-700:hover { background-image: none !important; }
.ring-primary-100 { --tw-ring-color: #8eb74d88 !important; }
.ring-primary-200\/80 { --tw-ring-color: #8eb74d88 !important; }
.ring-primary-500\/20 { --tw-ring-color: #8eb74d88 !important; }
.ring-primary-500\/40 { --tw-ring-color: #8eb74d88 !important; }
.text-gray-100 { color: var(--fox-text) !important; }
.text-gray-200 { color: var(--fox-text) !important; }
.text-gray-300 { color: var(--fox-muted) !important; }
.text-gray-400 { color: var(--fox-muted) !important; }
.text-gray-500 { color: var(--fox-muted) !important; }
.text-gray-600 { color: var(--fox-muted) !important; }
.text-gray-700 { color: var(--fox-text) !important; }
.text-gray-800 { color: var(--fox-text) !important; }
.text-gray-900 { color: var(--fox-text) !important; }
.text-gray-950 { color: var(--fox-text) !important; }
.text-primary-100 { color: var(--fox-accent) !important; }
.text-primary-200 { color: var(--fox-accent) !important; }
.text-primary-300 { color: var(--fox-accent) !important; }
.text-primary-400 { color: var(--fox-accent) !important; }
.text-primary-500 { color: var(--fox-accent) !important; }
.text-primary-600 { color: var(--fox-accent) !important; }
.text-primary-600\/90 { color: var(--fox-accent) !important; }
.text-primary-700 { color: var(--fox-accent) !important; }
.text-primary-800 { color: var(--fox-accent) !important; }
.text-primary-900 { color: var(--fox-accent) !important; }
.text-slate-400 { color: var(--fox-muted) !important; }
.text-slate-500 { color: var(--fox-muted) !important; }
.text-slate-600 { color: var(--fox-muted) !important; }
.text-slate-700 { color: var(--fox-text) !important; }
.text-teal-100 { color: var(--fox-accent) !important; }
.text-teal-200 { color: var(--fox-accent) !important; }
.text-teal-500 { color: var(--fox-accent) !important; }
.text-teal-600 { color: var(--fox-accent) !important; }
.text-teal-700 { color: var(--fox-accent) !important; }
.text-teal-800 { color: var(--fox-accent) !important; }
.to-gray-100 { background-image: none !important; }
.to-gray-200 { background-image: none !important; }
.to-gray-600 { background-image: none !important; }
.to-primary-100 { background-image: none !important; }
.to-primary-500 { background-image: none !important; }
.to-primary-600 { background-image: none !important; }
.via-primary-50\/30 { background-image: none !important; }

/* Installed AppSidebar selectors; preserve Vue widths, transforms, permissions and labels. */
aside.sidebar {
  background-color: var(--fox-inset) !important;
  background-image: linear-gradient(45deg,#8aa36208 25%,transparent 25%,transparent 75%,#8aa36208 75%),linear-gradient(45deg,#8aa36208 25%,transparent 25%,transparent 75%,#8aa36208 75%) !important;
  background-size: 16px 16px !important; background-position: 0 0,8px 8px !important;
  border-right: 3px solid var(--fox-line) !important;
  box-shadow: inset -3px 0 var(--fox-edge),4px 0 #0b17151a !important;
}
.sidebar .sidebar-header {
  flex-shrink: 0; min-height: 76px; height: 76px;
  padding-left: 16px; padding-right: 12px; gap: 12px;
  background: var(--fox-panel); border-bottom: 3px solid var(--fox-line) !important;
  box-shadow: inset 0 3px #c4dc9830;
}
.sidebar .sidebar-logo {
  flex-shrink: 0; border-radius: 0 !important; background: var(--fox-inset) !important;
  border: 2px solid var(--fox-line); padding: 3px;
  box-shadow: 3px 3px var(--fox-edge) !important;
}
.sidebar .sidebar-logo img { content: url('/fox-ui/pixel-20261009-2/pixel-fox.svg'); image-rendering: pixelated; }
.sidebar .sidebar-brand-title { color: var(--fox-accent) !important; letter-spacing: .025em; font-family: ui-monospace,Consolas,monospace; }
.sidebar .sidebar-nav { padding: 18px 10px; scrollbar-width: thin; scrollbar-color: var(--fox-line) transparent; }
.sidebar .sidebar-section { margin-bottom: 22px; }
.sidebar .sidebar-section-title {
  color: var(--fox-muted) !important; border-top: 2px solid var(--fox-line);
  padding: 13px 8px 3px; margin: 10px 0 9px; letter-spacing: .12em;
}
.sidebar .sidebar-section-title-text:not(.sidebar-section-title-text-collapsed)::before { content: '▪ '; color: var(--fox-accent); }
.sidebar .sidebar-link {
  position: relative; min-height: 46px; gap: 10px;
  border: 2px solid transparent !important; border-radius: 0 !important;
  padding: 7px 8px !important; margin-bottom: 6px;
  color: var(--fox-muted) !important; background: transparent !important;
  text-decoration: none; transition: background-color .12s,color .12s !important;
}
.sidebar .sidebar-link > svg, .sidebar .sidebar-link > .sidebar-svg-icon {
  box-sizing: border-box; flex-shrink: 0; width: 28px; height: 28px;
  padding: 4px; border: 1px solid var(--fox-line); border-radius: 0;
  background: var(--fox-panel); color: var(--fox-accent) !important;
  stroke-linecap: square; stroke-linejoin: miter;
}
.sidebar .sidebar-svg-icon svg { width: 100%; height: 100%; }
.sidebar .sidebar-link:hover {
  color: var(--fox-text) !important; background: var(--fox-panel) !important;
  border-color: var(--fox-line) !important; box-shadow: inset 2px 2px #bed99318;
}
.sidebar .sidebar-link.sidebar-link-active,
.sidebar .sidebar-link[aria-current='page'] {
  color: #f3f0d7 !important; background: #3d5937 !important;
  border-color: #94b566 !important;
  box-shadow: inset 2px 2px #c2e78a30,inset -2px -2px #172b2366,3px 3px var(--fox-edge);
  font-weight: 700;
}
.sidebar .sidebar-link.sidebar-link-active::after,
.sidebar .sidebar-link[aria-current='page']::after {
  content: ''; position: absolute; width: 5px; height: 5px; right: 5px; top: 5px;
  background: #c9ea85; box-shadow: 0 0 0 1px #213725;
}
.sidebar .sidebar-link.sidebar-link-active > svg,
.sidebar .sidebar-link[aria-current='page'] > svg,
.sidebar .sidebar-link.sidebar-link-active > .sidebar-svg-icon {
  background: #253a28; color: #d4edab !important; border-color: #86a961;
}
.sidebar .sidebar-nav .border-l { border-left: 2px solid var(--fox-line) !important; margin-left: 20px; padding-left: 8px; }
.sidebar .sidebar-nav .border-l .sidebar-link { min-height: 40px; font-size: 12px; }
.sidebar > .mt-auto {
  flex-shrink: 0; background: var(--fox-panel); border-top: 3px solid var(--fox-line) !important;
  padding: 10px; box-shadow: inset 0 2px #bed99318;
}
.sidebar > .mt-auto .sidebar-link { background: var(--fox-inset) !important; border-color: var(--fox-line) !important; }
.sidebar > .mt-auto .sidebar-link:last-child { margin-bottom: 0; }
.sidebar .sidebar-header.sidebar-header-collapsed { padding-left: 15px; padding-right: 15px; gap: 0; }
.sidebar .sidebar-link.sidebar-link-collapsed { justify-content: center; gap: 0; padding-left: 0 !important; padding-right: 0 !important; }
.sidebar .sidebar-link-collapsed > svg, .sidebar .sidebar-link-collapsed > .sidebar-svg-icon { width: 26px; height: 26px; }
.sidebar .sidebar-section-title-collapsed { padding: 0; height: 2px; margin: 14px 4px; }
@media (prefers-reduced-motion: reduce) { aside.sidebar, .sidebar .sidebar-link { transition: none !important; } }