:root[data-ui-theme="modern"] {
    --font-main: 'Segoe UI', 'Inter', Arial, sans-serif;
    --desktop-bg: #e8edf4;
    --desktop-pattern: linear-gradient(135deg, #eef3f8 0%, #dde7f2 100%);
    --surface-window: #ffffff;
    --surface-control: #f1f4f8;
    --surface-input: #ffffff;
    --surface-status: #f8fafc;
    --text-primary: #101828;
    --title-bg: #175cd3;
    --title-text: #ffffff;
    --border-outer: #c4ced9;
    --border-input: #b8c3d2;
    --border-muted: #d5dde8;
    --window-border-width: 1px;
    --control-border-width: 1px;
    --input-border-width: 1px;
    --window-shadow: 0 12px 30px rgba(16, 24, 40, 0.14);
    --button-shadow: none;
    --button-shadow-active: none;
    --focus-ring: 0 0 0 2px rgba(23, 92, 211, 0.22);
    --card-bg: #ffffff;
    --card-text: #101828;
    --card-border: #b8c3d2;
    --card-border-width: 1px;
    --selected-outline: 2px solid #175cd3;
    --modal-overlay: rgba(15, 23, 42, 0.35);
}

:root[data-ui-theme="modern"][data-theme="dark"] {
    --desktop-bg: #0b1220;
    --desktop-pattern: linear-gradient(140deg, #111b2c 0%, #09101d 100%);
    --surface-window: #111827;
    --surface-control: #1f2937;
    --surface-input: #0f172a;
    --surface-status: #172033;
    --text-primary: #e5edf7;
    --title-bg: #1d4ed8;
    --title-text: #ffffff;
    --border-outer: #334155;
    --border-input: #3f5169;
    --border-muted: #334155;
    --window-shadow: 0 14px 34px rgba(0, 0, 0, 0.45);
    --focus-ring: 0 0 0 2px rgba(96, 165, 250, 0.34);
    --card-bg: #1e293b;
    --card-text: #e5edf7;
    --card-border: #334155;
}

:root[data-ui-theme="modern"] body {
    background-color: var(--desktop-bg);
    background-image: var(--desktop-pattern);
    background-size: cover;
}

:root[data-ui-theme="modern"] .window,
:root[data-ui-theme="modern"] .vote-card,
:root[data-ui-theme="modern"] .preview-card,
:root[data-ui-theme="modern"] .btn,
:root[data-ui-theme="modern"] input,
:root[data-ui-theme="modern"] select,
:root[data-ui-theme="modern"] textarea {
    border-radius: 0.45rem;
}

:root[data-ui-theme="modern"] .preview-board,
:root[data-ui-theme="modern"] .voting-board {
    background: linear-gradient(180deg, #0f6f54 0%, #0a5c45 100%);
    border: 1px solid var(--border-input);
}

:root[data-ui-theme="modern"][data-theme="dark"] .preview-board,
:root[data-ui-theme="modern"][data-theme="dark"] .voting-board {
    background: linear-gradient(180deg, #0b3e33 0%, #082d25 100%);
}

:root[data-ui-theme="modern"] .preset-modal-overlay {
    background: var(--modal-overlay);
}