/* ============================================================ beebot — Design tokens (source unique de vérité) Mood par défaut : "Amber Noir". Voir DESIGN_SYSTEM.md §2. Importé par worker-ui, launcher (si web/Tauri) et apiary. Changer de mood : ============================================================ */ /* — Polices self-host : déposer les .woff2 dans ./fonts/ — (fallbacks système prévus tant que les fichiers ne sont pas là) */ @font-face{font-family:"Cabinet Grotesk";src:url("./fonts/CabinetGrotesk-Variable.woff2") format("woff2");font-weight:300 800;font-display:swap} @font-face{font-family:"Geist";src:url("./fonts/Geist-Variable.woff2") format("woff2");font-weight:100 900;font-display:swap} @font-face{font-family:"Geist Mono";src:url("./fonts/GeistMono-Variable.woff2") format("woff2");font-weight:100 900;font-display:swap} :root{ /* — Fonds (charbon tiède) — */ --bg-void:#0A0A0B; --bg-base:#0E0E10; --bg-surface:#16161A; --bg-surface-2:#1D1D22; --bg-surface-3:#26262C; /* — Bordures — */ --border:#2A2A31; --border-strong:#3A3A42; --border-honey:rgba(255,179,0,.28); /* — Texte (blanc crème, jamais #fff froid) — */ --text-hi:#F5F0E6; --text:#C9C4BA; --text-muted:#8A857A; --text-dim:#5C584F; /* — MIEL : l'accent héros — */ --honey:#FFB300; --honey-bright:#FFC93C; --honey-deep:#E08600; --pollen:#FFD54F; --honey-glow:rgba(255,179,0,.35); --honey-tint:rgba(255,179,0,.10); --honey-line:rgba(255,179,0,.20); --on-honey:#1A1200; /* — Sémantique (famille chaude) — */ --nectar:#A3D85C; --nectar-bg:rgba(163,216,92,.12); /* succès */ --wasp:#FF5A3C; --wasp-bg:rgba(255,90,60,.12); /* danger / alerte GM */ --warn:#FF9F1C; --warn-bg:rgba(255,159,28,.12); --cool:#5EC8FF; /* seule touche froide, ultra rare */ /* — Élévation — */ --shadow-sm:0 1px 2px rgba(0,0,0,.4); --shadow:0 8px 24px rgba(0,0,0,.45); --shadow-honey:0 0 0 1px var(--honey-line), 0 8px 32px var(--honey-glow); /* — Rayons — */ --r-sm:8px; --r:12px; --r-lg:16px; --r-xl:24px; --r-pill:999px; /* — Typo — */ --font-display:"Cabinet Grotesk","Geist",system-ui,sans-serif; --font-sans:"Geist",-apple-system,"Segoe UI",Roboto,system-ui,sans-serif; --font-mono:"Geist Mono",ui-monospace,Menlo,Consolas,monospace; /* — Espacement (échelle 4px) — */ --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s6:24px; --s8:32px; --s12:48px; --s16:64px; /* — Motif — (data-URI : indépendant de la profondeur du fichier qui consomme la variable. Le fichier shared/honeycomb.svg reste dispo pour un usage direct/édition.) */ --honeycomb:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z' fill='%23FFB300' fill-opacity='0.06'/%3E%3C/svg%3E"); } /* ===== Moods alternatifs (override ~8 variables) ===== */ :root[data-mood="cyber-hive"]{ --bg-void:#060807; --bg-base:#0A0D0B; --bg-surface:#0E1310; --bg-surface-2:#141A16; --bg-surface-3:#1B231D; --border:#1E2A20; --border-strong:#2C3A2E; --border-honey:rgba(198,255,0,.28); --honey:#C6FF00; --honey-bright:#D9FF4D; --honey-deep:#9ACC00; --pollen:#E4FF7A; --honey-glow:rgba(198,255,0,.30); --honey-tint:rgba(198,255,0,.08); --honey-line:rgba(198,255,0,.20); --on-honey:#0A1500; --nectar:#7CF2C0; --wasp:#FF3B6B; --wasp-bg:rgba(255,59,107,.12); } :root[data-mood="royal-honey"]{ --bg-void:#0E0716; --bg-base:#120A1A; --bg-surface:#1C1226; --bg-surface-2:#241731; --bg-surface-3:#2E2140; --border:#2E2138; --border-strong:#3E2E4C; --border-honey:rgba(245,197,66,.30); --honey:#F5C542; --honey-bright:#FFE08A; --honey-deep:#D9A521; --pollen:#FFE08A; --honey-glow:rgba(245,197,66,.32); --honey-tint:rgba(245,197,66,.10); --honey-line:rgba(245,197,66,.22); --on-honey:#1A1200; --nectar:#B9E66A; --wasp:#FF6F8B; --wasp-bg:rgba(255,111,139,.12); } :root[data-mood="light-comb"]{ --bg-void:#F3EBDC; --bg-base:#FBF6EC; --bg-surface:#FFFFFF; --bg-surface-2:#FBF6EC; --bg-surface-3:#F1E7D5; --border:#EDE3D1; --border-strong:#E0D2BA; --border-honey:rgba(224,134,0,.35); --text-hi:#1A1712; --text:#4A453B; --text-muted:#857C6B; --text-dim:#A89D88; --honey:#E08600; --honey-bright:#FFB300; --honey-deep:#B36A00; --pollen:#F5A623; --honey-glow:rgba(224,134,0,.22); --honey-tint:rgba(224,134,0,.08); --honey-line:rgba(224,134,0,.20); --on-honey:#FFFFFF; --nectar:#5E9E1E; --nectar-bg:rgba(94,158,30,.12); --wasp:#E0431F; --wasp-bg:rgba(224,67,31,.10); --warn:#C9760A; --shadow:0 8px 24px rgba(80,60,20,.12); } /* ===== Primitives optionnelles (raccourcis) ===== */ .bb-hex{clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)} .bb-mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums} @media (prefers-reduced-motion:reduce){*{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}}