:root {
    --ventio-accent: #52c41a;
    --ventio-accent-hover: #73d13d;
    --ventio-accent-active: #389e0d;
    --ventio-accent-soft: #f6ffed;
    --ventio-background: #f5f6f8;
    --ventio-surface: #ffffff;
    --ventio-surface-muted: #f8fafc;
    --ventio-text: #1f2937;
    --ventio-text-muted: #667085;
    --ventio-border: #e4e7ec;
    --ventio-border-strong: #98a2b3;
    --ventio-success: #15803d;
    --ventio-success-soft: #ecfdf3;
    --ventio-warning: #b45309;
    --ventio-warning-soft: #fffbeb;
    --ventio-danger: #b42318;
    --ventio-focus: rgba(82, 196, 26, 0.2);
    --ventio-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.05);
    --ventio-shadow-lg: 0 8px 24px rgba(16, 24, 40, 0.14);
    --ventio-radius-control: 6px;
    --ventio-radius-card: 8px;
    --ventio-header-height: 40px;
    --ventio-space-1: 4px;
    --ventio-space-2: 8px;
    --ventio-space-3: 12px;
    --ventio-space-4: 16px;
    --ventio-space-5: 24px;
    --ventio-space-6: 32px;
    --ventio-space-8: 48px;
    --ant-primary-color: var(--ventio-accent);
    --ant-primary-color-hover: var(--ventio-accent-hover);
    --ant-primary-color-active: var(--ventio-accent-active);
    --ant-primary-color-outline: var(--ventio-focus);
    --ant-primary-1: #f6ffed;
    --ant-primary-2: #d9f7be;
    --ant-primary-3: #b7eb8f;
    --ant-primary-4: #95de64;
    --ant-primary-5: #73d13d;
    --ant-primary-6: #52c41a;
    --ant-primary-7: #389e0d;
    --antd-wave-shadow-color: var(--ventio-accent);
    --ant-success-color: var(--ventio-success);
    --ant-warning-color: var(--ventio-warning);
    --ant-error-color: var(--ventio-danger);
    --ant-font-size-base: 14px;
    --ant-heading-color: var(--ventio-text);
    --ant-text-color: var(--ventio-text);
    --ant-text-color-secondary: var(--ventio-text-muted);
    --ant-disabled-color: var(--ventio-text-muted);
    --ant-border-radius-base: var(--ventio-radius-control);
    --ant-border-color-base: var(--ventio-border);
}

:root[data-theme="dark"] {
    --ventio-accent: #49aa19;
    --ventio-accent-hover: #3c8618;
    --ventio-accent-active: #6abe39;
    --ventio-accent-soft: #162312;
    --ventio-background: #000000;
    --ventio-surface: #141414;
    --ventio-surface-muted: #1f1f1f;
    --ventio-text: #ffffffd9;
    --ventio-text-muted: #ffffffa6;
    --ventio-border: #303030;
    --ventio-border-strong: #424242;
    --ventio-success: #4ade80;
    --ventio-success-soft: #173525;
    --ventio-warning: #fbbf24;
    --ventio-warning-soft: #3b2e13;
    --ventio-danger: #f04438;
    --ventio-focus: rgba(73, 170, 25, 0.38);
    --ventio-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.24);
    --ventio-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.34);
    --ant-primary-1: #162312;
    --ant-primary-2: #1d3712;
    --ant-primary-3: #274916;
    --ant-primary-4: #306317;
    --ant-primary-5: #3c8618;
    --ant-primary-6: #49aa19;
    --ant-primary-7: #6abe39;
}

* {
    box-sizing: border-box;
}

html {
    background: var(--ventio-background);
    color-scheme: light;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 14px;
}

html[data-theme="dark"] {
    color-scheme: dark;
}

body {
    background: var(--ventio-background);
    color: var(--ventio-text);
    margin: 0;
    min-width: 320px;
}

button,
input,
select,
textarea {
    font: inherit;
}

a {
    color: var(--ventio-accent);
}

a:hover {
    color: var(--ventio-accent-hover);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid var(--ventio-accent);
    outline-offset: 2px;
}

::selection {
    background: var(--ventio-accent);
    color: #ffffff;
}

:root[data-theme="dark"] .ant-btn:not(.ant-btn-primary):not(.ant-btn-link):not([disabled]):hover,
:root[data-theme="dark"] .ant-btn:not(.ant-btn-primary):not(.ant-btn-link):not([disabled]):focus {
    border-color: var(--ventio-accent-hover);
    color: var(--ventio-accent-hover);
}

:root[data-theme="dark"] .ant-btn:not(.ant-btn-primary):not(.ant-btn-link):not([disabled]):active {
    border-color: var(--ventio-accent-active);
    color: var(--ventio-accent-active);
}

:root[data-theme="dark"] .ant-btn-link:not([disabled]) {
    color: var(--ventio-accent);
}

:root[data-theme="dark"] .ant-btn-link:not([disabled]):hover,
:root[data-theme="dark"] .ant-btn-link:not([disabled]):focus {
    color: var(--ventio-accent-hover);
}

:root[data-theme="dark"] .ant-btn-link:not([disabled]):active {
    color: var(--ventio-accent-active);
}

:root[data-theme="dark"] .ant-btn-primary:not([disabled]) {
    background: var(--ventio-accent);
    border-color: var(--ventio-accent);
}

:root[data-theme="dark"] .ant-btn-primary:not([disabled]):hover,
:root[data-theme="dark"] .ant-btn-primary:not([disabled]):focus {
    background: var(--ventio-accent-hover);
    border-color: var(--ventio-accent-hover);
}

:root[data-theme="dark"] .ant-btn-primary:not([disabled]):active {
    background: var(--ventio-accent-active);
    border-color: var(--ventio-accent-active);
}

:root[data-theme="dark"] .ant-spin-dot-item {
    background: var(--ventio-accent);
}

h1[tabindex="-1"]:focus {
    outline: none;
}

#app-loading {
    align-items: center;
    color: var(--ventio-text-muted);
    display: flex;
    flex-direction: column;
    gap: var(--ventio-space-3);
    inset: 0;
    justify-content: center;
    position: fixed;
}

.app-loading-mark {
    align-items: center;
    background: var(--ventio-accent);
    border-radius: var(--ventio-radius-card);
    color: #ffffff;
    display: inline-flex;
    font-size: 18px;
    font-weight: 700;
    height: 40px;
    justify-content: center;
    width: 40px;
}

.theme-toggle {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: var(--ventio-radius-control);
    color: var(--ventio-text-muted);
    cursor: pointer;
    display: inline-flex;
    flex: 0 0 auto;
    height: 32px;
    justify-content: center;
    padding: 0;
    width: 32px;
}

.theme-toggle:hover {
    background: var(--ventio-surface-muted);
    color: var(--ventio-text);
}

.theme-toggle .anticon {
    font-size: 18px;
}

.theme-toggle-sun {
    display: none;
}

[data-theme="dark"] .theme-toggle-moon {
    display: none;
}

[data-theme="dark"] .theme-toggle-sun {
    display: inline-flex;
}

.status-page {
    margin: 0 auto;
    max-width: 560px;
    padding: 15vh var(--ventio-space-4) var(--ventio-space-8);
    text-align: center;
}

.status-code {
    color: var(--ventio-accent);
    display: block;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin-bottom: var(--ventio-space-2);
}

.status-page h1 {
    color: var(--ventio-text);
    font-size: 28px;
    margin: 0 0 var(--ventio-space-3);
}

.status-page p {
    color: var(--ventio-text-muted);
    margin: 0 0 var(--ventio-space-5);
}

.primary-link {
    background: var(--ventio-accent);
    border-radius: var(--ventio-radius-control);
    color: #ffffff;
    display: inline-block;
    font-weight: 600;
    padding: 8px 14px;
    text-decoration: none;
}

.primary-link:hover {
    background: var(--ventio-accent-hover);
    color: #ffffff;
}

.valid.modified:not([type="checkbox"]) {
    outline: 1px solid var(--ventio-success);
}

.invalid {
    outline: 1px solid var(--ventio-danger);
}

.validation-message {
    color: var(--ventio-danger);
}
