mrleo1nidandClaude Opus 5.5
de4e59d9f8
An axe-core audit of every screen in both themes found low contrast on white text over the accent and on caption text, track rows using row roles without cells, and unlabelled progress bars. Accent fills now use a darker token, caption text meets 4.5:1, track lists are lists and progress bars are labelled. The queue drawer slides in from the right as designed, takes focus, closes on Escape and notes that the wave never ends. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
154 lines
4.1 KiB
CSS
154 lines
4.1 KiB
CSS
/* Сгенерировано scripts/build.mjs из tokens.json — не редактировать. */
|
|
:root {
|
|
--radius-sm: 8px;
|
|
--radius-md: 12px;
|
|
--radius-lg: 16px;
|
|
--radius-xl: 24px;
|
|
--radius-pill: 999px;
|
|
--wave-color1: #2F80FF;
|
|
--wave-color2: #7C5CFF;
|
|
--wave-color3: #35D3FF;
|
|
--font-display: 'Unbounded', system-ui, sans-serif;
|
|
--font-body: 'Onest', system-ui, sans-serif;
|
|
--font-mono: 'JetBrains Mono', ui-monospace, monospace;
|
|
--bg: #05070D;
|
|
--bg2: #080B14;
|
|
--surface: #0B0F1A;
|
|
--surface2: #121827;
|
|
--surface3: #1A2236;
|
|
--elev: #111726;
|
|
--hover: rgba(120,150,255,.07);
|
|
--line: rgba(130,160,255,.10);
|
|
--line2: rgba(130,160,255,.18);
|
|
--text: #EDF1FF;
|
|
--text2: #A0ABC6;
|
|
--text3: #7F8BA8;
|
|
--accent: #2F80FF;
|
|
--accent2: #5E9BFF;
|
|
--accent-fill: #1A66E6;
|
|
--accent-fill2: #1F6FF2;
|
|
--accent-soft: rgba(47,128,255,.15);
|
|
--violet: #9B7CFF;
|
|
--violet-soft: rgba(124,92,255,.16);
|
|
--ok: #2FD39A;
|
|
--ok-soft: rgba(47,211,154,.14);
|
|
--warn: #FFB547;
|
|
--warn-soft: rgba(255,181,71,.14);
|
|
--danger: #FF5C70;
|
|
--danger-soft: rgba(255,92,112,.14);
|
|
--overlay: rgba(3,5,10,.66);
|
|
--glass: rgba(12,16,28,.78);
|
|
--surface-a: rgba(11,15,26,.70);
|
|
--bar-a: rgba(6,9,16,.55);
|
|
--shadow: 0 24px 64px rgba(0,0,0,.55);
|
|
--glow: 0 8px 28px rgba(47,128,255,.38);
|
|
--amb-op: .8;
|
|
}
|
|
|
|
@media (prefers-color-scheme: light) {
|
|
:root:not([data-theme='dark']) {
|
|
--bg: #F3F5FA;
|
|
--bg2: #EBEEF5;
|
|
--surface: #FFFFFF;
|
|
--surface2: #F0F3F9;
|
|
--surface3: #E4E9F3;
|
|
--elev: #FFFFFF;
|
|
--hover: rgba(30,60,140,.06);
|
|
--line: rgba(20,35,80,.10);
|
|
--line2: rgba(20,35,80,.17);
|
|
--text: #0A0F1E;
|
|
--text2: #4B5675;
|
|
--text3: #5C6785;
|
|
--accent: #1F6FF2;
|
|
--accent2: #1F6FF2;
|
|
--accent-fill: #1A63DB;
|
|
--accent-fill2: #165ED6;
|
|
--accent-soft: rgba(31,111,242,.10);
|
|
--violet: #6A47F0;
|
|
--violet-soft: rgba(106,71,240,.10);
|
|
--ok: #0E9465;
|
|
--ok-soft: rgba(14,148,101,.10);
|
|
--warn: #A86200;
|
|
--warn-soft: rgba(168,98,0,.10);
|
|
--danger: #D32F47;
|
|
--danger-soft: rgba(211,47,71,.09);
|
|
--overlay: rgba(20,30,60,.32);
|
|
--glass: rgba(255,255,255,.84);
|
|
--surface-a: rgba(255,255,255,.74);
|
|
--bar-a: rgba(255,255,255,.55);
|
|
--shadow: 0 24px 64px rgba(20,30,60,.18);
|
|
--glow: 0 8px 24px rgba(31,111,242,.28);
|
|
--amb-op: .45;
|
|
}
|
|
}
|
|
|
|
:root[data-theme='light'] {
|
|
--bg: #F3F5FA;
|
|
--bg2: #EBEEF5;
|
|
--surface: #FFFFFF;
|
|
--surface2: #F0F3F9;
|
|
--surface3: #E4E9F3;
|
|
--elev: #FFFFFF;
|
|
--hover: rgba(30,60,140,.06);
|
|
--line: rgba(20,35,80,.10);
|
|
--line2: rgba(20,35,80,.17);
|
|
--text: #0A0F1E;
|
|
--text2: #4B5675;
|
|
--text3: #5C6785;
|
|
--accent: #1F6FF2;
|
|
--accent2: #1F6FF2;
|
|
--accent-fill: #1A63DB;
|
|
--accent-fill2: #165ED6;
|
|
--accent-soft: rgba(31,111,242,.10);
|
|
--violet: #6A47F0;
|
|
--violet-soft: rgba(106,71,240,.10);
|
|
--ok: #0E9465;
|
|
--ok-soft: rgba(14,148,101,.10);
|
|
--warn: #A86200;
|
|
--warn-soft: rgba(168,98,0,.10);
|
|
--danger: #D32F47;
|
|
--danger-soft: rgba(211,47,71,.09);
|
|
--overlay: rgba(20,30,60,.32);
|
|
--glass: rgba(255,255,255,.84);
|
|
--surface-a: rgba(255,255,255,.74);
|
|
--bar-a: rgba(255,255,255,.55);
|
|
--shadow: 0 24px 64px rgba(20,30,60,.18);
|
|
--glow: 0 8px 24px rgba(31,111,242,.28);
|
|
--amb-op: .45;
|
|
}
|
|
|
|
:root[data-theme='dark'] {
|
|
--bg: #05070D;
|
|
--bg2: #080B14;
|
|
--surface: #0B0F1A;
|
|
--surface2: #121827;
|
|
--surface3: #1A2236;
|
|
--elev: #111726;
|
|
--hover: rgba(120,150,255,.07);
|
|
--line: rgba(130,160,255,.10);
|
|
--line2: rgba(130,160,255,.18);
|
|
--text: #EDF1FF;
|
|
--text2: #A0ABC6;
|
|
--text3: #7F8BA8;
|
|
--accent: #2F80FF;
|
|
--accent2: #5E9BFF;
|
|
--accent-fill: #1A66E6;
|
|
--accent-fill2: #1F6FF2;
|
|
--accent-soft: rgba(47,128,255,.15);
|
|
--violet: #9B7CFF;
|
|
--violet-soft: rgba(124,92,255,.16);
|
|
--ok: #2FD39A;
|
|
--ok-soft: rgba(47,211,154,.14);
|
|
--warn: #FFB547;
|
|
--warn-soft: rgba(255,181,71,.14);
|
|
--danger: #FF5C70;
|
|
--danger-soft: rgba(255,92,112,.14);
|
|
--overlay: rgba(3,5,10,.66);
|
|
--glass: rgba(12,16,28,.78);
|
|
--surface-a: rgba(11,15,26,.70);
|
|
--bar-a: rgba(6,9,16,.55);
|
|
--shadow: 0 24px 64px rgba(0,0,0,.55);
|
|
--glow: 0 8px 28px rgba(47,128,255,.38);
|
|
--amb-op: .8;
|
|
}
|