1@import "tailwindcss";23/* ------------------------------------------------------------------ tokens */4:root {5 --background: #f7f8fa;6 --surface: #ffffff;7 --surface-2: #f1f3f5;8 --surface-3: #e9ecf0;9 --border: rgba(20, 25, 35, 0.09);10 --border-strong: rgba(20, 25, 35, 0.18);11 --text: #111318;12 --text-2: #656b76;13 --text-3: #8a909b;14 --qc26: #111827;15 --qc26-accent: #2563eb;16 --qc26-accent-soft: rgba(37, 99, 235, 0.1);17 --live: #dc2626;18 --ok: #15803d;19 --warn: #b45309;20 --radius: 10px;21 --radius-lg: 16px;22 --shadow-sm: 0 1px 2px rgba(17, 19, 24, 0.04), 0 1px 1px rgba(17, 19, 24, 0.03);23 --shadow-md: 0 6px 24px -12px rgba(17, 19, 24, 0.18), 0 2px 6px -2px rgba(17, 19, 24, 0.06);24 --font-sans: var(--font-inter), ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;25 --font-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;26 --header-h: 56px;27 --bottom-nav-h: 60px;28}2930@theme inline {31 --color-background: var(--background);32 --color-surface: var(--surface);33 --color-surface-2: var(--surface-2);34 --color-surface-3: var(--surface-3);35 --color-border: var(--border);36 --color-border-strong: var(--border-strong);37 --color-ink: var(--text);38 --color-ink-2: var(--text-2);39 --color-ink-3: var(--text-3);40 --color-brand: var(--qc26);41 --color-accent: var(--qc26-accent);42 --color-accent-soft: var(--qc26-accent-soft);43 --color-live: var(--live);44 --color-ok: var(--ok);45 --color-warn: var(--warn);46 --font-sans: var(--font-sans);47 --font-mono: var(--font-mono);48 --radius-card: var(--radius);49 --radius-card-lg: var(--radius-lg);50}5152/* ------------------------------------------------------------------- base */53html {54 color-scheme: light;55 -webkit-text-size-adjust: 100%;56 scroll-behavior: smooth;57}58@media (prefers-reduced-motion: reduce) {59 html { scroll-behavior: auto; }60 *, *::before, *::after { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }61}62body {63 background: var(--background);64 color: var(--text);65 font-family: var(--font-sans);66 font-feature-settings: "cv11", "ss01", "ss03";67 -webkit-font-smoothing: antialiased;68 text-rendering: optimizeLegibility;69 min-height: 100dvh;70}71.num { font-variant-numeric: tabular-nums lining-nums; letter-spacing: -0.01em; }72.display { letter-spacing: -0.035em; line-height: 0.95; font-weight: 700; }73.eyebrow { font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 600; color: var(--text-2); }74.mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }7576.card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); }77.card-lg { border-radius: var(--radius-lg); }78.hairline { border-color: var(--border); }79.surface-2 { background: var(--surface-2); }8081/* Dans @layer base pour que les utilitaires Tailwind (text-white, etc.) gardent la priorité. */82@layer base {83 a { color: inherit; text-decoration: none; }84 a:hover { text-decoration: none; }85}86.link { color: var(--qc26-accent); }87.link:hover { text-decoration: underline; text-underline-offset: 3px; }8889::selection { background: rgba(37, 99, 235, 0.18); }90:focus-visible { outline: 2px solid var(--qc26-accent); outline-offset: 2px; border-radius: 4px; }9192/* -------------------------------------------------------------- utilities */93.scrollbar-none { scrollbar-width: none; }94.scrollbar-none::-webkit-scrollbar { display: none; }95.safe-bottom { padding-bottom: max(env(safe-area-inset-bottom), 0px); }96.tabular { font-variant-numeric: tabular-nums; }9798@keyframes pulse-dot { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }99.live-dot { width: 8px; height: 8px; border-radius: 999px; background: var(--live); display: inline-block; animation: pulse-dot 1.6s ease-in-out infinite; }100@keyframes fade-up { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }101.fade-up { animation: fade-up 0.35s ease-out both; }102@keyframes ticker-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }103.ticker-in { animation: ticker-in 0.3s ease-out both; }104105/* table */106.data-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13.5px; }107.data-table th { text-align: left; font-weight: 600; color: var(--text-2); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; padding: 10px 12px; border-bottom: 1px solid var(--border); white-space: nowrap; position: sticky; top: 0; background: var(--surface); z-index: 1; }108.data-table td { padding: 10px 12px; border-bottom: 1px solid var(--border); vertical-align: middle; }109.data-table tr:last-child td { border-bottom: 0; }110.data-table tbody tr:hover { background: var(--surface-2); }111.data-table .r { text-align: right; }112113/* range input */114input[type="range"] { accent-color: var(--qc26); }115116/* print */117@media print { header, nav, footer, .no-print { display: none !important; } body { background: #fff; } }118