/* ============================================================ DESIGN SYSTEM — tokens (contract + themes) Usage: + include tokens.css then base.css Add a new brand = add a [data-theme="..."] block. Names never change. ============================================================ */ :root{ /* type scale (theme-agnostic) */ --fs-1:12px; --fs-2:14px; --fs-3:16px; --fs-4:18px; --fs-5:22px; --fs-6:28px; --fs-7:36px; --fs-8:clamp(36px,6vw,56px); --fs-9:clamp(48px,8vw,72px); --lh-tight:1.05; --lh-body:1.6; /* spacing scale (4px base) */ --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:64px; --sp-9:96px; /* radius / motion / layout */ --r-sm:8px; --r-md:14px; --r-lg:22px; --r-full:999px; --ease:cubic-bezier(.2,.6,.2,1); --dur:.2s; --maxw:1200px; } /* ---------- THEME: tegro (xAI / Wall Street Black) ---------- */ [data-theme="tegro"]{ --bg:#000; --surface:#0a0a0b; --surface-2:#121214; --text:#fafafa; --text-muted:#8a8a90; --line:rgba(255,255,255,.09); --accent:linear-gradient(135deg,#fff,#d2d2d8,#9a9aa1); --accent-solid:#d2d2d8; --accent-2:#3a82f6; --on-accent:#0a0a0b; --success:#3ad29f; --warning:#f5b544; --danger:#ff5c5c; --font-sans:"Manrope",-apple-system,system-ui,sans-serif; --font-serif:Georgia,"Times New Roman",serif; --font-mono:"JetBrains Mono",ui-monospace,monospace; --shadow-1:0 1px 2px rgba(0,0,0,.4); --shadow-2:0 8px 30px rgba(0,0,0,.5); --shadow-3:0 20px 60px rgba(0,0,0,.6); } /* ---------- THEME: libermall (Премиальный банк: графит + золото) ---------- Канон значений — Mini App pay-defi-card-whitelabel/globals.css. Композиция и UX-паттерны от Т-Банка, палитра ВСЕГДА наша: графит + золото. Пастель, мультицвет и фиолетовые градиенты запрещены — рушат премиум. */ [data-theme="libermall"]{ --bg:#0a0a0c; --surface:#0f0f12; --surface-2:#17171b; --text:#fafafa; --text-muted:#8b8b93; --line:rgba(255,255,255,.08); --accent:linear-gradient(135deg,#ffd74d,#ffc700,#d9a400); --accent-solid:#ffc700; --accent-2:#ffc700; --on-accent:#141006; --success:#22c55e; --warning:#f5b544; --danger:#ff5c5c; --font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif; --font-serif:Georgia,"Times New Roman",serif; --font-mono:"JetBrains Mono",ui-monospace,monospace; --shadow-1:0 1px 2px rgba(0,0,0,.4); --shadow-2:0 8px 30px rgba(0,0,0,.5); --shadow-3:0 20px 60px rgba(0,0,0,.6); } /* ---------- THEME: rosmedia (dark + gold) — verify exact hex on first use ---------- */ [data-theme="rosmedia"]{ --bg:#0b0b0d; --surface:#141416; --surface-2:#1c1c20; --text:#f5f0e6; --text-muted:#9a9385; --line:rgba(212,175,55,.18); --accent:linear-gradient(135deg,#f7e08a,#d4af37,#a8842a); --accent-solid:#d4af37; --accent-2:#d4af37; --on-accent:#1a1408; --success:#3ad29f; --warning:#f5b544; --danger:#ff5c5c; --font-sans:"Manrope",-apple-system,system-ui,sans-serif; --font-serif:Georgia,serif; --font-mono:ui-monospace,monospace; --shadow-1:0 1px 2px rgba(0,0,0,.5); --shadow-2:0 8px 30px rgba(0,0,0,.55); --shadow-3:0 20px 60px rgba(0,0,0,.65); } /* ---------- THEME: 1984 (Terminal / cyberpunk) ---------- */ [data-theme="1984"]{ --bg:#060806; --surface:#0c100c; --surface-2:#121712; --text:#e8ffe8; --text-muted:#6f9a6f; --line:rgba(60,238,169,.18); --accent:linear-gradient(135deg,#3CEEA9,#22b37e); --accent-solid:#3CEEA9; --accent-2:#3CEEA9; --on-accent:#021008; --success:#3CEEA9; --warning:#f5b544; --danger:#ff5c5c; --font-sans:"JetBrains Mono",ui-monospace,monospace; --font-serif:"JetBrains Mono",monospace; --font-mono:"JetBrains Mono",ui-monospace,monospace; --shadow-1:0 1px 2px rgba(0,0,0,.5); --shadow-2:0 8px 30px rgba(0,0,0,.55); --shadow-3:0 0 40px rgba(60,238,169,.12); } /* ---------- THEME: dozor (внутренний ops-кокпит) ---------- Нейтральная по бренду НАМЕРЕННО: панель показывает Libermall и Tegro на одном экране, и любая брендовая тема здесь означала бы, что один продукт вывеской накрыл другой. Графит + холодная сталь, акцент тихий — потому что кричать на этом экране должны --success/--warning/--danger, а не кнопки. */ [data-theme="dozor"]{ --bg:#0c0e12; --surface:#13161c; --surface-2:#1a1e26; --text:#e8ebf0; --text-muted:#8b93a3; --line:rgba(232,235,240,.09); --accent:linear-gradient(135deg,#7fb2ff,#3a82f6,#2563c9); --accent-solid:#3a82f6; --accent-2:#3a82f6; --on-accent:#05070c; --success:#3ad29f; --warning:#f5b544; --danger:#ff5c5c; --font-sans:"Manrope",-apple-system,system-ui,sans-serif; --font-serif:Georgia,"Times New Roman",serif; --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,monospace; --shadow-1:0 1px 2px rgba(0,0,0,.45); --shadow-2:0 8px 30px rgba(0,0,0,.55); --shadow-3:0 20px 60px rgba(0,0,0,.65); } /* ---------- THEME: faptap (тап-игра 18+, индиго-неон) ---------- Продолжение айдентики самой игры: front/src/styles.css (--dark-900 #131418, --dark-700 #191b20, градиент #b3acfc→#584cf4, Ubuntu). Лендинг и мини-апп обязаны читаться как один продукт. */ [data-theme="faptap"]{ --bg:#06060c; --surface:#0d0d16; --surface-2:#14141f; --text:#f2f4ff; --text-muted:#a3a8c3; --line:rgba(242,244,255,.10); --accent:linear-gradient(120deg,#22e8ff,#00aff0 45%,#7a5cff); --accent-solid:#00aff0; --accent-2:#ff3d8b; --on-accent:#03060c; --success:#3ad29f; --warning:#f5b544; --danger:#ff4d6d; --font-sans:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; --font-display:"Unbounded","Manrope",sans-serif; --font-serif:Georgia,"Times New Roman",serif; --font-mono:"JetBrains Mono",ui-monospace,monospace; --shadow-1:0 1px 2px rgba(0,0,0,.5); --shadow-2:0 18px 50px rgba(0,0,0,.6); --shadow-3:0 30px 90px rgba(0,80,140,.45); }