:root{--ink:#f3eee6;--paper:#15131c;--accent:#ff8a3d;--deep:#ffb27a;--soft:#221f2c;--display:'Beiruti',Arial,sans-serif;--body:'Fira Sans',Arial,sans-serif;--mono:'Fira Code',Consolas,monospace;color-scheme:dark}
/* Composition propre à cette identité. */
@media(max-width:760px){body[class*=design-] .hero{grid-template-columns:1fr}}
.design-tempo ::selection{background:var(--accent);color:var(--paper)}
.design-tempo .eyebrow,.design-tempo .topic-number,.design-tempo .story-meta,.design-tempo figcaption,.design-tempo .article-meta{font-family:var(--mono)}
.design-tempo .site-topline{background:var(--accent);color:var(--paper);border:0}
.design-tempo .brand>span{font-family:var(--display);font-weight:800;font-size:25px}
.design-tempo .hero h1{font-weight:800;line-height:1}
.design-tempo h1,.design-tempo h2,.design-tempo h3,.design-tempo h4,.design-tempo .brand>span{letter-spacing:0;word-spacing:.14em}
.design-tempo .status-dot{background:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 30%,transparent)}
.design-tempo .hero-art{border-radius:24px;overflow:hidden;box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 50%,transparent),0 30px 80px -30px color-mix(in srgb,var(--accent) 55%,transparent)}
.design-tempo .hero-art figcaption{margin:0;padding:14px 18px;background:var(--soft);border:0}
.design-tempo .button{background:var(--accent);color:var(--paper);border-radius:40px}
.design-tempo .button:hover{background:var(--deep);color:var(--paper)}
.design-tempo .topics{border:0;gap:12px}
.design-tempo .topics .topic{background:var(--soft);border:0;border-radius:16px;padding:22px 18px}
.design-tempo .topic-number{color:var(--accent);opacity:1}
.design-tempo .section-heading h2,.design-tempo .story h3{font-weight:700}
.design-tempo .section-symbol{color:var(--accent)}
.design-tempo .story{background:var(--soft);border-radius:18px;overflow:hidden}
.design-tempo .story-content{padding:20px 20px 18px}
.design-tempo .story-category{color:var(--accent)}
.design-tempo .notebook{background:linear-gradient(135deg,var(--soft),#2e2233);border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);border-radius:24px}
.design-tempo .notebook-icon{color:var(--accent)}
.design-tempo .page-numbers.current{background:var(--accent);color:var(--paper)}
.design-tempo .search-form button,.design-tempo .comments-area input[type=submit]{background:var(--accent);color:var(--paper)}
@media(max-width:760px){.design-tempo .topics .topic{padding:18px 12px}.design-tempo .hero-image{background:var(--soft)}}
