/* FMSI Finance — темы, акценты и живой фон. Сгенерировано из макета Claude (2026-09-24). */ /* Использование: */ :root, [data-theme="black"] { --bg: #000000; --s0: #0A0A0B; --s1: #111113; --s2: #1C1C1F; --line: #232326; --line2: #2E2E33; --track: #1F1F22; --tx: #FFFFFF; --mu: #A1A1A6; --mu2: #8E8E93; --green-ink: #7EE0BA; --green-soft: rgba(126,224,186,.14); --orange-ink: #FFB08A; --orange-soft: rgba(255,176,138,.14); --blue-ink: #8FB4FF; --blue-soft: rgba(143,180,255,.14); --bar: rgba(0,0,0,.94); --sheet: rgba(20,20,22,.98); } [data-theme="white"] { --bg: #FFFFFF; --s0: #F2F2F4; --s1: #F4F4F6; --s2: #EBEBEE; --line: #E6E6EA; --line2: #D4D4DA; --track: #E6E6EA; --tx: #0B0B0C; --mu: #5E5E63; --mu2: #77777C; --green-ink: #1D7A58; --green-soft: #DDF3EA; --orange-ink: #A94B1F; --orange-soft: #FBE6DA; --blue-ink: #2F5FB8; --blue-soft: #E1EAFB; --bar: rgba(255,255,255,.95); --sheet: rgba(255,255,255,.97); } [data-theme="aurora"] { --bg: #07080B; --s0: rgba(10,10,14,.6); --s1: rgba(22,22,28,.62); --s2: rgba(255,255,255,.07); --line: rgba(255,255,255,.08); --line2: rgba(255,255,255,.14); --track: rgba(255,255,255,.1); --tx: #F4F2EC; --mu: #B3B0A9; --mu2: #8E8B85; --acc-ink: #F2D24B; --acc-soft: rgba(242,210,75,.14); --acc-soft2: rgba(242,210,75,.08); --acc-line: rgba(242,210,75,.28); --green-ink: #7EE0BA; --green-soft: rgba(126,224,186,.14); --orange-ink: #FFB08A; --orange-soft: rgba(255,176,138,.14); --blue-ink: #8FB4FF; --blue-soft: rgba(143,180,255,.14); --bar: rgba(10,10,14,.72); --sheet: rgba(20,20,26,.86); } [data-theme="light"] { --bg: #F3F1EC; --s0: #E9E6DF; --s1: rgba(255,255,255,.82); --s2: #ECE9E2; --line: #E3DFD5; --line2: #D6D1C6; --track: #E6E2D9; --tx: #141413; --mu: #5F5B55; --mu2: #77736C; --acc-ink: #7A5E00; --acc-soft: #FBF0C4; --acc-soft2: #FDF6DA; --acc-line: #EBD98A; --green-ink: #1D7A58; --green-soft: #DDF3EA; --orange-ink: #A94B1F; --orange-soft: #FBE6DA; --blue-ink: #2F5FB8; --blue-soft: #E1EAFB; --bar: rgba(250,249,246,.86); --sheet: rgba(252,251,248,.94); } [data-theme="glass"] { --bg: #1A1033; --s0: rgba(255,255,255,.12); --s1: rgba(255,255,255,.13); --s2: rgba(255,255,255,.16); --line: rgba(255,255,255,.22); --line2: rgba(255,255,255,.3); --track: rgba(255,255,255,.2); --tx: #FFFFFF; --mu: rgba(255,255,255,.78); --mu2: rgba(255,255,255,.66); --acc-ink: #FFE27A; --acc-soft: rgba(255,226,122,.2); --acc-soft2: rgba(255,255,255,.12); --acc-line: rgba(255,226,122,.45); --green-ink: #9DF2CF; --green-soft: rgba(157,242,207,.2); --orange-ink: #FFC3A6; --orange-soft: rgba(255,195,166,.2); --blue-ink: #BFD3FF; --blue-soft: rgba(191,211,255,.2); --bar: rgba(255,255,255,.14); --sheet: rgba(255,255,255,.16); } [data-theme="clear"] { --bg: #12141A; --s0: rgba(255,255,255,.05); --s1: rgba(255,255,255,.07); --s2: rgba(255,255,255,.1); --line: rgba(255,255,255,.16); --line2: rgba(255,255,255,.24); --track: rgba(255,255,255,.14); --tx: #FFFFFF; --mu: rgba(255,255,255,.78); --mu2: rgba(255,255,255,.64); --green-ink: #9DF2CF; --green-soft: rgba(157,242,207,.16); --orange-ink: #FFC3A6; --orange-soft: rgba(255,195,166,.16); --blue-ink: #BFD3FF; --blue-soft: rgba(191,211,255,.16); --bar: rgba(255,255,255,.07); --sheet: rgba(255,255,255,.08); } [data-theme="black"][data-accent="yellow"], :root:not([data-accent]) { --acc:#F2D24B; --acc-ink:#F2D24B; --acc-soft:rgba(242,210,75,0.14); --acc-soft2:rgba(242,210,75,0.07); --acc-line:rgba(242,210,75,0.34); --acc-glow:rgba(242,210,75,0.28); } [data-theme="white"][data-accent="yellow"] { --acc:#F2D24B; --acc-ink:#7A5E00; --acc-soft:rgba(242,210,75,0.2); --acc-soft2:rgba(242,210,75,0.1); --acc-line:rgba(242,210,75,0.34); --acc-glow:rgba(242,210,75,0.28); } [data-theme="aurora"][data-accent="yellow"] { --acc:#F2D24B; --acc-ink:#F2D24B; --acc-soft:rgba(242,210,75,0.14); --acc-soft2:rgba(242,210,75,0.07); --acc-line:rgba(242,210,75,0.34); --acc-glow:rgba(242,210,75,0.28); } [data-theme="light"][data-accent="yellow"] { --acc:#F2D24B; --acc-ink:#7A5E00; --acc-soft:rgba(242,210,75,0.2); --acc-soft2:rgba(242,210,75,0.1); --acc-line:rgba(242,210,75,0.34); --acc-glow:rgba(242,210,75,0.28); } [data-theme="glass"][data-accent="yellow"] { --acc:#F2D24B; --acc-ink:#FFE27A; --acc-soft:rgba(242,210,75,0.24); --acc-soft2:rgba(242,210,75,0.12); --acc-line:rgba(242,210,75,0.34); --acc-glow:rgba(242,210,75,0.28); } [data-theme="clear"][data-accent="yellow"] { --acc:#F2D24B; --acc-ink:#FFE27A; --acc-soft:rgba(242,210,75,0.24); --acc-soft2:rgba(242,210,75,0.12); --acc-line:rgba(242,210,75,0.34); --acc-glow:rgba(242,210,75,0.28); } [data-theme="black"][data-accent="mint"] { --acc:#63E6BE; --acc-ink:#63E6BE; --acc-soft:rgba(99,230,190,0.14); --acc-soft2:rgba(99,230,190,0.07); --acc-line:rgba(99,230,190,0.34); --acc-glow:rgba(99,230,190,0.28); } [data-theme="white"][data-accent="mint"] { --acc:#63E6BE; --acc-ink:#0B7A5A; --acc-soft:rgba(99,230,190,0.2); --acc-soft2:rgba(99,230,190,0.1); --acc-line:rgba(99,230,190,0.34); --acc-glow:rgba(99,230,190,0.28); } [data-theme="aurora"][data-accent="mint"] { --acc:#63E6BE; --acc-ink:#63E6BE; --acc-soft:rgba(99,230,190,0.14); --acc-soft2:rgba(99,230,190,0.07); --acc-line:rgba(99,230,190,0.34); --acc-glow:rgba(99,230,190,0.28); } [data-theme="light"][data-accent="mint"] { --acc:#63E6BE; --acc-ink:#0B7A5A; --acc-soft:rgba(99,230,190,0.2); --acc-soft2:rgba(99,230,190,0.1); --acc-line:rgba(99,230,190,0.34); --acc-glow:rgba(99,230,190,0.28); } [data-theme="glass"][data-accent="mint"] { --acc:#63E6BE; --acc-ink:#A6F5DC; --acc-soft:rgba(99,230,190,0.24); --acc-soft2:rgba(99,230,190,0.12); --acc-line:rgba(99,230,190,0.34); --acc-glow:rgba(99,230,190,0.28); } [data-theme="clear"][data-accent="mint"] { --acc:#63E6BE; --acc-ink:#A6F5DC; --acc-soft:rgba(99,230,190,0.24); --acc-soft2:rgba(99,230,190,0.12); --acc-line:rgba(99,230,190,0.34); --acc-glow:rgba(99,230,190,0.28); } [data-theme="black"][data-accent="blue"] { --acc:#74A7FF; --acc-ink:#74A7FF; --acc-soft:rgba(116,167,255,0.14); --acc-soft2:rgba(116,167,255,0.07); --acc-line:rgba(116,167,255,0.34); --acc-glow:rgba(116,167,255,0.28); } [data-theme="white"][data-accent="blue"] { --acc:#74A7FF; --acc-ink:#2556B8; --acc-soft:rgba(116,167,255,0.2); --acc-soft2:rgba(116,167,255,0.1); --acc-line:rgba(116,167,255,0.34); --acc-glow:rgba(116,167,255,0.28); } [data-theme="aurora"][data-accent="blue"] { --acc:#74A7FF; --acc-ink:#74A7FF; --acc-soft:rgba(116,167,255,0.14); --acc-soft2:rgba(116,167,255,0.07); --acc-line:rgba(116,167,255,0.34); --acc-glow:rgba(116,167,255,0.28); } [data-theme="light"][data-accent="blue"] { --acc:#74A7FF; --acc-ink:#2556B8; --acc-soft:rgba(116,167,255,0.2); --acc-soft2:rgba(116,167,255,0.1); --acc-line:rgba(116,167,255,0.34); --acc-glow:rgba(116,167,255,0.28); } [data-theme="glass"][data-accent="blue"] { --acc:#74A7FF; --acc-ink:#C2D6FF; --acc-soft:rgba(116,167,255,0.24); --acc-soft2:rgba(116,167,255,0.12); --acc-line:rgba(116,167,255,0.34); --acc-glow:rgba(116,167,255,0.28); } [data-theme="clear"][data-accent="blue"] { --acc:#74A7FF; --acc-ink:#C2D6FF; --acc-soft:rgba(116,167,255,0.24); --acc-soft2:rgba(116,167,255,0.12); --acc-line:rgba(116,167,255,0.34); --acc-glow:rgba(116,167,255,0.28); } [data-theme="black"][data-accent="coral"] { --acc:#FF8E72; --acc-ink:#FF8E72; --acc-soft:rgba(255,142,114,0.14); --acc-soft2:rgba(255,142,114,0.07); --acc-line:rgba(255,142,114,0.34); --acc-glow:rgba(255,142,114,0.28); } [data-theme="white"][data-accent="coral"] { --acc:#FF8E72; --acc-ink:#B23A1C; --acc-soft:rgba(255,142,114,0.2); --acc-soft2:rgba(255,142,114,0.1); --acc-line:rgba(255,142,114,0.34); --acc-glow:rgba(255,142,114,0.28); } [data-theme="aurora"][data-accent="coral"] { --acc:#FF8E72; --acc-ink:#FF8E72; --acc-soft:rgba(255,142,114,0.14); --acc-soft2:rgba(255,142,114,0.07); --acc-line:rgba(255,142,114,0.34); --acc-glow:rgba(255,142,114,0.28); } [data-theme="light"][data-accent="coral"] { --acc:#FF8E72; --acc-ink:#B23A1C; --acc-soft:rgba(255,142,114,0.2); --acc-soft2:rgba(255,142,114,0.1); --acc-line:rgba(255,142,114,0.34); --acc-glow:rgba(255,142,114,0.28); } [data-theme="glass"][data-accent="coral"] { --acc:#FF8E72; --acc-ink:#FFC4B4; --acc-soft:rgba(255,142,114,0.24); --acc-soft2:rgba(255,142,114,0.12); --acc-line:rgba(255,142,114,0.34); --acc-glow:rgba(255,142,114,0.28); } [data-theme="clear"][data-accent="coral"] { --acc:#FF8E72; --acc-ink:#FFC4B4; --acc-soft:rgba(255,142,114,0.24); --acc-soft2:rgba(255,142,114,0.12); --acc-line:rgba(255,142,114,0.34); --acc-glow:rgba(255,142,114,0.28); } [data-theme="black"][data-accent="lilac"] { --acc:#B197FC; --acc-ink:#B197FC; --acc-soft:rgba(177,151,252,0.14); --acc-soft2:rgba(177,151,252,0.07); --acc-line:rgba(177,151,252,0.34); --acc-glow:rgba(177,151,252,0.28); } [data-theme="white"][data-accent="lilac"] { --acc:#B197FC; --acc-ink:#6541C8; --acc-soft:rgba(177,151,252,0.2); --acc-soft2:rgba(177,151,252,0.1); --acc-line:rgba(177,151,252,0.34); --acc-glow:rgba(177,151,252,0.28); } [data-theme="aurora"][data-accent="lilac"] { --acc:#B197FC; --acc-ink:#B197FC; --acc-soft:rgba(177,151,252,0.14); --acc-soft2:rgba(177,151,252,0.07); --acc-line:rgba(177,151,252,0.34); --acc-glow:rgba(177,151,252,0.28); } [data-theme="light"][data-accent="lilac"] { --acc:#B197FC; --acc-ink:#6541C8; --acc-soft:rgba(177,151,252,0.2); --acc-soft2:rgba(177,151,252,0.1); --acc-line:rgba(177,151,252,0.34); --acc-glow:rgba(177,151,252,0.28); } [data-theme="glass"][data-accent="lilac"] { --acc:#B197FC; --acc-ink:#D9CCFF; --acc-soft:rgba(177,151,252,0.24); --acc-soft2:rgba(177,151,252,0.12); --acc-line:rgba(177,151,252,0.34); --acc-glow:rgba(177,151,252,0.28); } [data-theme="clear"][data-accent="lilac"] { --acc:#B197FC; --acc-ink:#D9CCFF; --acc-soft:rgba(177,151,252,0.24); --acc-soft2:rgba(177,151,252,0.12); --acc-line:rgba(177,151,252,0.34); --acc-glow:rgba(177,151,252,0.28); } /* Живой фон (Аврора / Светлая / Стекло / Прозрачная) */ .bg-live { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; } .bg-live .blob { position: absolute; border-radius: 50%; filter: blur(70px); animation: fmsi-drift 22s ease-in-out infinite alternate; } .bg-live .blob:nth-child(2) { animation-duration: 28s; animation-delay: -6s; } .bg-live .blob:nth-child(3) { animation-duration: 34s; animation-delay: -12s; } @keyframes fmsi-drift { 0% { transform: translate(0,0); } 50% { transform: translate(60px,-40px); } 100% { transform: translate(-50px,60px); } } @media (prefers-reduced-motion: reduce) { .bg-live .blob { animation: none; } } /* Эффекты стекла по темам */ [data-theme="aurora"] .card, [data-theme="aurora"] nav { backdrop-filter:blur(22px) saturate(140%);-webkit-backdrop-filter:blur(22px) saturate(140%) } [data-theme="light"] .card, [data-theme="light"] nav { backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px) } [data-theme="light"] .card { box-shadow:0 1px 2px rgba(20,20,19,.04),0 8px 24px rgba(20,20,19,.05) } [data-theme="glass"] .card, [data-theme="glass"] nav, [data-theme="glass"] .qa span.c { backdrop-filter:blur(26px) saturate(170%);-webkit-backdrop-filter:blur(26px) saturate(170%) } [data-theme="glass"] .card { box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 10px 30px rgba(0,0,0,.18) } [data-theme="glass"] nav { left:14px !important;right:14px !important;bottom:14px !important;height:72px !important;border-radius:36px;border:1px solid rgba(255,255,255,.28) !important;padding:8px 10px !important;align-items:center !important;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 12px 30px rgba(0,0,0,.25) } [data-theme="glass"] nav a[aria-label] { margin-top:0 !important;width:54px !important;height:54px !important } [data-theme="clear"] .card, [data-theme="clear"] nav, [data-theme="clear"] .qa span.c { backdrop-filter:blur(30px) saturate(120%);-webkit-backdrop-filter:blur(30px) saturate(120%) } [data-theme="clear"] .card { box-shadow:inset 0 1px 0 rgba(255,255,255,.18) } [data-theme="clear"] .content { text-shadow:0 1px 2px rgba(0,0,0,.25) } [data-theme="clear"] nav { left:14px !important;right:14px !important;bottom:14px !important;height:72px !important;border-radius:36px;border:1px solid rgba(255,255,255,.22) !important;padding:8px 10px !important;align-items:center !important;box-shadow:inset 0 1px 0 rgba(255,255,255,.25) } [data-theme="clear"] nav a[aria-label] { margin-top:0 !important;width:54px !important;height:54px !important }