/* HC Intranet — jetons. Couleurs §9.2 intangibles. Tout le reste est l'échelle du lot 0c. Aucune valeur de rythme hors de cette feuille. */ :root { /* --- Couleurs imposées, section 9.2 --- */ --fond-profond: #0C0E13; --verre: rgba(255, 255, 255, 0.045); --verre-bord: rgba(255, 255, 255, 0.10); --lueur-chaude: #E8B04B; --texte: #EDEFF3; --texte-doux: #8B93A3; /* --- Surfaces : l'obscurité est un matériau --- Quatre fonds, du salon (0) au plateau sous la lampe (3). Chaque cran se lève vers le chaud, pas vers le bleu. */ --surface-0: #0C0E13; --surface-1: #14171F; --surface-2: #1A1E28; --surface-3: #232834; /* Arête haute : la veilleuse accroche le verre. Pas une ombre. */ --arete: rgba(255, 230, 190, 0.10); --arete-forte: rgba(255, 230, 190, 0.18); --bord: rgba(255, 255, 255, 0.07); --bord-fort: rgba(255, 255, 255, 0.12); --lueur-chaude-rvb: 232, 176, 75; --fond-avertissement: rgba(232, 176, 75, 0.06); --bord-avertissement: rgba(232, 176, 75, 0.28); --fond-code: var(--surface-1); --lueur-voile: rgba(232, 176, 75, 0.35); /* --- Grille de 4 --- */ --espace-1: 4px; --espace-2: 8px; --espace-3: 12px; --espace-4: 16px; --espace-5: 20px; --espace-6: 24px; --espace-8: 32px; --espace-10: 40px; --espace-12: 48px; --espace-16: 64px; /* Trombone de pièce jointe, en masque : une icône sans requête. PDF, diapositive, grille et page : mêmes traits, pas les logos déposés. */ --icone-trombone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.5 4.5 5.9 9.1a1.6 1.6 0 0 0 2.3 2.3l4.9-4.9a3 3 0 0 0-4.2-4.2L3.7 7.4a4.4 4.4 0 0 0 6.2 6.2l4.3-4.3'/%3E%3C/svg%3E"); --icone-pdf: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 2.5h5L12.5 6v7.5a1 1 0 0 1-1 1h-7a1 1 0 0 1-1-1v-10a1 1 0 0 1 1-1z'/%3E%3Cpath d='M9 2.5V6h3.5'/%3E%3Cpath d='M5.5 8.5h5M5.5 10.5h5M5.5 12.5h3'/%3E%3C/svg%3E"); --icone-powerpoint: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='3' width='11' height='7.5' rx='1'/%3E%3Cpath d='M4.5 5.25h7'/%3E%3Cpath d='M4.5 7.5h4.5'/%3E%3Cpath d='M8 10.5v2.5'/%3E%3Cpath d='M5.5 13h5'/%3E%3C/svg%3E"); --icone-excel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='2.5' width='11' height='11' rx='1'/%3E%3Cpath d='M2.5 6.17h11M2.5 9.83h11'/%3E%3Cpath d='M6.17 2.5v11M9.83 2.5v11'/%3E%3C/svg%3E"); --icone-word: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='2.5' width='10' height='11' rx='1'/%3E%3Cpath d='M4.5 4.5v7'/%3E%3Cpath d='M6.5 5.5h5M6.5 8h5M6.5 10.5h3.5'/%3E%3C/svg%3E"); /* Lien qui part ailleurs : une boîte ouverte, pas une flèche collée. */ --icone-lien-externe: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3.5H3.5v9h9V9'/%3E%3Cpath d='M9.5 3.5h3v3M12.5 3.5 7 9'/%3E%3C/svg%3E"); /* Téléchargement : une flèche vers le plateau, pas le chevron de l'outil. */ --icone-telecharge: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 3v7'/%3E%3Cpath d='M5 8.5 8 11.5 11 8.5'/%3E%3Cpath d='M3.5 13h9'/%3E%3C/svg%3E"); --filet: 1px; --anneau: 2px; /* --- Arrondis : le rayon dit le rang --- plein = objet tenu en main (pilule, pastille) s = contrôle (champ, bouton, touche) m = carte, liste, code, encadré l = surface de premier plan (tuile d'accueil) */ --rayon-s: 4px; --rayon-m: 8px; --rayon-l: 16px; --rayon-plein: 999px; --rayon-tuile: var(--rayon-l); --rayon: var(--rayon-m); /* --- Type : graisses 400–600, tracking selon la taille --- */ --police: Inter, ui-sans-serif, system-ui, sans-serif; --police-code: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; --texte-xs: 12px; --texte-s: 14px; --texte-m: 16px; --titre-s: 20px; --titre-m: 24px; --titre-l: 32px; --poids-corps: 400; --poids-meta: 500; --poids-titre: 600; --approche-s: -0.01em; --approche-m: -0.02em; --approche-l: -0.03em; --interligne: 1.7; --interligne-titre: 1.25; --mesure: 70ch; --corps: var(--texte-m); --meta: var(--texte-xs); --titre-tuile: 17px; --titre-fiche: var(--titre-l); /* --- Mise en page --- */ --largeur-page: 90rem; /* Une page de navigation : titre, commandes et liste dans la même colonne, un peu plus large que la mesure du texte courant. */ --largeur-colonne: 60rem; --gouttiere: clamp(16px, 3vw, 40px); /* Place réservée à gauche du texte d'une fiche pour le « + » et la poignée « ⋮⋮ » de l'éditeur. Sans elle, ils passent sous le rail. */ --gouttiere-blocs: 60px; --tuile-min: 13.5rem; --tuile-hauteur: 10rem; --recherche-largeur: 520px; --recherche-hauteur: 44px; --rail-min: 224px; /* Menu de gauche : 280 px tiennent « Procédures internes » + pictogramme + chevron sur une ligne. L'utilisateur peut écarter de 256 à 384. */ --rail-nav: 280px; --rail-nav-min: 256px; --rail-nav-max: 384px; --zone-saisie: 112px; --nuancier-hauteur: 96px; /* Verre poli des tuiles : le fond transparaît, le halo l'effleure. */ --flou-verre: 18px; /* --- Mouvement : deux courbes, deux durées --- */ --duree-rapide: 120ms; --duree-pose: 180ms; --courbe-sortie: cubic-bezier(0.2, 0.8, 0.2, 1); --courbe-entree: cubic-bezier(0.4, 0, 1, 1); }