:root{
    :root{
      /* Palette harmonisée avec la page principale */
      --bg: #0f0f10;
      --card: #111214cc;
      --muted: #bfc3c6;
      --accent: #d9a85b; /* warm gold */
      --glass: rgba(255,255,255,0.04);
    }

    *{box-sizing:border-box}
    body{
      margin:0;
      font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, Arial;
      background: radial-gradient(1200px 600px at 10% 10%, rgba(30,30,30,0.6), transparent), linear-gradient(180deg,#070707,#0e0e10);
      color: #e9e9ea;
      padding:18px;
    }

    .box{margin:10px; padding:10px; border-radius:13px}
    a{color:var(--accent); text-decoration:none}

    .somaire ul{display:flex; column-gap:20px; flex-wrap:wrap}
    .somaire ul li{display:inline-block}

    .titel-chapitre{
      color:var(--accent);
      text-align:center;
      font-size:20px;
      margin:6% 0;
      font-style:italic;
    }
    .premerRoméne{color:var(--muted); width:100%; margin:10px 0; padding-left:2%}
    .théorème{color:#f0c87a; font-weight:700}
    .théorème_content{background:var(--card); color:var(--muted); padding:10px; border-radius:8px; border-left:4px solid rgba(240,200,122,0.12)}
    .définition_content{background:var(--glass); padding:10px; border-radius:8px}
    .définition{color:#fff; width:100%; text-decoration:underline}
    .définition:hover{text-decoration:overline}
    .définition-text{padding:10px; color:var(--muted)}
    .exemple_content{background:rgba(143,192,169,0.04)}
    .exemple{color:#8FC0A9; font-weight:600}
    .prposition_content{background:rgba(217,168,91,0.06)}
    .prposition{color:var(--accent); width:100%; font-weight:700}
    .corollaire_content{background:rgba(255,255,255,0.02)}
    .corollaire{color:var(--muted)}

    ul{list-style-type: lower-greek; background-color:transparent}
    ol{display:none}
    .bb li::marker{animation:zoomin 1s ease infinite}
    img{max-width:360px; height:auto; display:block}

    @keyframes zoomin{
      0%,100%{transform:scale(1.2)}
      50%{transform:scale(1)}
    }

    /* small responsive tweaks */
    @media(max-width:700px){
      .titel-chapitre{font-size:18px; margin:6% 0}
      img{max-width:100%}
          img{max-width:100%}
        }
    }