:root {
    --ap-bg: #05070a;
    --ap-panel: #0b1118;
    --ap-panel-2: #0f1720;
    --ap-line: rgba(148, 163, 184, 0.18);
    --ap-line-strong: rgba(34, 211, 238, 0.34);
    --ap-text: #e6f7fb;
    --ap-muted: rgba(226, 246, 251, 0.62);
    --ap-dim: rgba(226, 246, 251, 0.42);
    --ap-cyan: #22d3ee;
    --ap-fuchsia: #e879f9;
    --ap-lime: #bef264;
    --ap-danger: #f87171;
}

* {
    box-sizing: border-box;
}

html {
    background: var(--ap-bg);
}

body {
    margin: 0;
    min-height: 100vh;
    background:
        radial-gradient(circle at 12% 0%, rgba(34, 211, 238, 0.08), transparent 34rem),
        linear-gradient(180deg, #05070a 0%, #080d13 100%) !important;
    color: var(--ap-text) !important;
    font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    letter-spacing: 0;
}

.bg-gray-100,
.bg-white,
.bg-gray-50 {
    background: transparent !important;
}

.min-h-screen {
    background: transparent !important;
}

nav.bg-white {
    background: rgba(5, 7, 10, 0.86) !important;
    border-bottom: 1px solid var(--ap-line);
    box-shadow: none !important;
    backdrop-filter: blur(16px);
}

aside.bg-white {
    background: rgba(8, 13, 19, 0.72) !important;
    border-right: 1px solid var(--ap-line);
    box-shadow: none !important;
}

main {
    color: var(--ap-text);
}

.shadow,
.shadow-lg,
.shadow-xl {
    box-shadow: none !important;
}

.rounded,
.rounded-lg,
.rounded-full {
    border-radius: 8px !important;
}

.max-w-md > .bg-white,
.bg-white.rounded-lg,
.bg-white.rounded-lg.shadow,
.bg-white.rounded-lg.shadow-xl,
.bg-blue-50,
.bg-red-100,
.bg-green-100 {
    background: linear-gradient(180deg, rgba(15, 23, 32, 0.96), rgba(8, 13, 19, 0.96)) !important;
    border: 1px solid var(--ap-line) !important;
    color: var(--ap-text) !important;
}

h1,
h2,
h3,
.text-gray-800,
.text-gray-900 {
    color: var(--ap-text) !important;
}

.text-gray-700,
.text-gray-600,
.text-gray-500,
.text-blue-800,
.text-blue-900 {
    color: var(--ap-muted) !important;
}

.text-purple-600,
.text-blue-600,
.hover\:text-blue-800:hover {
    color: var(--ap-cyan) !important;
}

.text-green-600,
.text-green-800 {
    color: var(--ap-lime) !important;
}

.text-red-600,
.text-red-700,
.hover\:text-red-800:hover {
    color: var(--ap-danger) !important;
}

a {
    transition: color 140ms ease, border-color 140ms ease, background 140ms ease;
}

a.block,
button,
input[type="submit"] {
    font-weight: 650 !important;
}

.bg-purple-600,
.hover\:bg-purple-700:hover,
.bg-blue-600,
.hover\:bg-blue-700:hover,
.bg-green-600,
.hover\:bg-green-700:hover,
.bg-orange-600,
.hover\:bg-orange-700:hover {
    background: rgba(34, 211, 238, 0.10) !important;
    border: 1px solid rgba(34, 211, 238, 0.32) !important;
    color: var(--ap-cyan) !important;
}

.bg-red-600,
.hover\:bg-red-700:hover {
    background: rgba(248, 113, 113, 0.10) !important;
    border: 1px solid rgba(248, 113, 113, 0.32) !important;
    color: var(--ap-danger) !important;
}

aside nav a {
    border: 1px solid transparent;
    color: var(--ap-muted) !important;
}

aside nav a:hover {
    background: rgba(34, 211, 238, 0.06) !important;
    border-color: rgba(34, 211, 238, 0.18);
    color: var(--ap-text) !important;
}

aside nav a.bg-purple-600 {
    background: rgba(34, 211, 238, 0.12) !important;
    border-color: rgba(34, 211, 238, 0.34) !important;
    color: var(--ap-cyan) !important;
}

table {
    border-collapse: collapse;
}

thead,
.border-b,
.divide-y > :not([hidden]) ~ :not([hidden]) {
    border-color: var(--ap-line) !important;
}

th {
    color: var(--ap-dim) !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

td {
    color: var(--ap-muted) !important;
}

tr.hover\:bg-gray-50:hover {
    background: rgba(34, 211, 238, 0.04) !important;
}

input,
textarea,
select {
    width: 100%;
    background: rgba(5, 7, 10, 0.76) !important;
    border: 1px solid var(--ap-line) !important;
    color: var(--ap-text) !important;
    border-radius: 8px !important;
    outline: none;
}

input[type="checkbox"] {
    width: auto !important;
}

input:focus,
textarea:focus,
select:focus {
    border-color: var(--ap-line-strong) !important;
    box-shadow: 0 0 0 3px rgba(34, 211, 238, 0.08) !important;
}

input::placeholder,
textarea::placeholder {
    color: var(--ap-dim) !important;
}

code,
textarea.font-mono {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
}

.bg-blue-100 {
    background: rgba(34, 211, 238, 0.10) !important;
    color: var(--ap-cyan) !important;
}

.bg-green-100 {
    background: rgba(190, 242, 100, 0.08) !important;
    border-color: rgba(190, 242, 100, 0.20) !important;
}

.bg-red-100 {
    background: rgba(248, 113, 113, 0.08) !important;
    border-color: rgba(248, 113, 113, 0.24) !important;
}

.border,
.border-t,
.border-gray-200,
.border-gray-300,
.border-blue-200,
.border-red-400,
.border-green-400 {
    border-color: var(--ap-line) !important;
}

.text-4xl {
    display: none;
}

@media (max-width: 900px) {
    .flex {
        flex-wrap: wrap;
    }

    aside.w-64 {
        width: 100% !important;
        min-height: auto !important;
        border-right: 0;
        border-bottom: 1px solid var(--ap-line);
    }

    main.p-8 {
        padding: 1rem !important;
    }
}
