:root{
  --bg:#F2EDE1; --card:#F8F5EC; --ink:#17150F; --soft:#7A7060;
  --acc:#C23B22; --line:#17150F; --faint:#CFC5AE;
  --shadow:rgba(23,21,15,.07);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#15130F; --card:#1C1A14; --ink:#EDE6D6; --soft:#968E7C;
    --acc:#E0603F; --line:#4A4438; --faint:#332F26; --shadow:rgba(0,0,0,.35);
  }
}
:root[data-theme="dark"]{
  --bg:#15130F; --card:#1C1A14; --ink:#EDE6D6; --soft:#968E7C;
  --acc:#E0603F; --line:#4A4438; --faint:#332F26; --shadow:rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:"Assistant","Segoe UI",system-ui,sans-serif;font-size:17px;line-height:1.65;
  -webkit-font-smoothing:antialiased;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
}
.wrap{max-width:50rem;margin:0 auto;padding:0 1.25rem 4rem}

/* nav */
.nav{display:flex;flex-wrap:wrap;gap:1.4rem;justify-content:center;
  padding:1.6rem 0 1.4rem;font-family:"Bellefair",serif;font-size:1.08rem}
.nav a{color:var(--soft);text-decoration:none}
.nav a:hover{color:var(--acc)}
.nav a[aria-current]{color:var(--ink);border-bottom:1px solid var(--acc);padding-bottom:2px}

h1{font-family:"Bellefair",serif;font-weight:400;font-size:2rem;margin:1.2rem 0 .2rem;text-align:center}
.lead{margin:0 auto 1.6rem;color:var(--soft);max-width:30rem;text-align:center;font-size:.98rem}
h2{font-family:"Bellefair",serif;font-weight:400;font-size:1.45rem;margin:2.6rem 0 .6rem;
  padding-top:1.3rem;border-top:1px solid var(--faint)}
h3{font-family:"Bellefair",serif;font-weight:400;font-size:1.2rem;margin:1.7rem 0 .3rem;color:var(--acc)}
a{color:var(--acc)}
.prose{max-width:36rem;margin:0 auto}
.prose p{margin:0 0 1rem}
.prose ul{margin:0 0 1rem;padding-inline-start:1.2rem}
.prose li{margin-bottom:.45rem}

/* champ */
.field{max-width:30rem;margin:0 auto}
.inp{width:100%;background:var(--card);color:var(--ink);
  border:1px solid var(--line);border-radius:2px;
  font-family:"Frank Ruhl Libre",Georgia,serif;font-size:2rem;font-weight:500;
  padding:.6em .5em;text-align:center;box-shadow:2px 2px 0 var(--acc)}
.inp::placeholder{color:var(--soft);opacity:.55;font-size:.6em}
.inp:focus{outline:2px solid var(--acc);outline-offset:2px}
textarea.inp{font-size:1.35rem;min-height:5.5rem;resize:vertical;line-height:1.6}

/* roue */
.wheelwrap{display:flex;justify-content:center;margin:1.6rem 0 .4rem;min-height:19rem}
.wheel{width:19rem;height:19rem;border-radius:50%;border:1px solid var(--line);position:relative;
  display:flex;align-items:center;justify-content:center;overflow:visible;flex:none}
.wheel::before{content:"";position:absolute;inset:1.3rem;border-radius:50%;border:1px solid var(--faint)}
.wheel::after{content:"";position:absolute;inset:4.8rem;border-radius:50%;border:1px solid var(--line)}
.hub{text-align:center;z-index:2}
.hub .n{font-family:"Bellefair",serif;font-size:4.4rem;line-height:1;color:var(--acc);
  font-variant-numeric:tabular-nums}
.hub .lab{font-family:"Frank Ruhl Libre",serif;font-size:1.15rem;color:var(--soft);letter-spacing:.1em}
.ltr{position:absolute;width:2.5rem;height:2.5rem;margin:-1.25rem 0 0 -1.25rem;left:50%;top:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;z-index:2}
.ltr b{font-family:"Frank Ruhl Libre",serif;font-size:1.45rem;font-weight:400}
.ltr i{font-style:normal;font-family:"Bellefair",serif;font-size:.74rem;color:var(--acc)}

/* repli en bande pour les textes longs */
.strip{display:flex;flex-wrap:wrap;gap:.35rem;justify-content:center;margin:1.4rem 0 .6rem}
.strip .t{border:1px solid var(--faint);border-radius:2px;min-width:2.7rem;padding:.4rem .25rem .25rem;text-align:center;background:var(--card)}
.strip .t b{display:block;font-family:"Frank Ruhl Libre",serif;font-size:1.3rem;font-weight:400;line-height:1.1}
.strip .t i{display:block;font-style:normal;font-family:"Bellefair",serif;font-size:.72rem;color:var(--acc)}
.bigtotal{text-align:center;margin:.6rem 0 0}
.bigtotal .n{font-family:"Bellefair",serif;font-size:4rem;line-height:1;color:var(--acc);font-variant-numeric:tabular-nums}
.bigtotal .lab{font-family:"Frank Ruhl Libre",serif;font-size:1.1rem;color:var(--soft);letter-spacing:.1em}
.meta{text-align:center;color:var(--soft);font-size:.9rem;margin:.3rem 0 0}

/* boutons */
.row{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin:1.3rem 0 0}
button.act{background:none;border:1px solid var(--line);border-radius:2px;color:var(--ink);
  cursor:pointer;font-family:"Assistant",sans-serif;font-size:.92rem;padding:.4rem 1.1rem}
button.act:hover{border-color:var(--acc);color:var(--acc)}
button.act.primary{background:var(--acc);border-color:var(--acc);color:#F8F5EC}
button.act.primary:hover{background:var(--ink);border-color:var(--ink);color:#F8F5EC}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--acc);outline-offset:2px}

/* tableau des methodes */
table{width:100%;border-collapse:collapse;margin:.4rem 0 0}
caption{text-align:center;color:var(--soft);font-family:"Bellefair",serif;font-size:1.1rem;padding-bottom:.5rem}
th,td{border-bottom:1px solid var(--faint);padding:.5rem .2rem;text-align:right;font-weight:400}
td.val,th.val{text-align:left;font-family:"Bellefair",serif;font-size:1.25rem;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.methods{max-width:28rem;margin:1.4rem auto 0}
.methods .hint{display:block;color:var(--soft);font-size:.8rem;line-height:1.35}

/* comparaison */
.cmp{max-width:32rem;margin:2rem auto 0;border-top:1px solid var(--faint);padding-top:1rem}
.cmp h3{text-align:center;margin:0 0 .7rem;color:var(--soft);font-size:1.1rem}
.cmp ol{list-style:none;margin:0;padding:0}
.cmp li{display:flex;align-items:baseline;gap:.7rem;padding:.45rem .2rem;border-bottom:1px solid var(--faint)}
.cmp li .w{font-family:"Frank Ruhl Libre",serif;font-size:1.35rem;flex:1;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmp li .v{font-family:"Bellefair",serif;font-size:1.5rem;font-variant-numeric:tabular-nums}
.cmp li.dup{background:color-mix(in srgb,var(--acc) 9%,transparent)}
.cmp li.dup .v{color:var(--acc)}
.cmp .x{background:none;border:none;color:var(--soft);cursor:pointer;font-size:1.1rem;
  line-height:1;padding:.1rem .3rem}
.cmp .x:hover{color:var(--acc)}
.cmp .foot{display:flex;justify-content:space-between;align-items:center;margin-top:.6rem;
  color:var(--soft);font-size:.86rem}
.cmp .foot button{background:none;border:none;color:var(--soft);cursor:pointer;
  font:inherit;text-decoration:underline}
.cmp .foot button:hover{color:var(--acc)}
.cmp .empty{color:var(--soft);font-size:.9rem;text-align:center;padding:.6rem 0}

/* correspondances */
.hits{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center;margin:0;padding:0;list-style:none}
.hits li{border:1px solid var(--faint);border-radius:999px;padding:.16rem .8rem;background:var(--card);
  display:inline-flex;gap:.45rem;align-items:baseline}
.hits li b{font-family:"Frank Ruhl Libre",serif;font-weight:400;font-size:1.1rem}
.hits li small{color:var(--soft);font-size:.74rem;white-space:nowrap}
.note{color:var(--soft);font-size:.9rem;text-align:center;margin:0 0 .9rem}
.more{background:none;border:none;color:var(--acc);cursor:pointer;font:inherit;font-size:.9rem;
  display:block;margin:.8rem auto 0;text-decoration:underline}

/* option */
.opt{display:flex;align-items:flex-start;gap:.55rem;max-width:32rem;margin:1.6rem auto 0;
  background:var(--card);border:1px solid var(--faint);border-radius:2px;padding:.75rem .9rem;font-size:.9rem}
.opt input{margin:.35rem 0 0;accent-color:var(--acc);flex:none}
.opt span{color:var(--soft)}

/* prenoms */
.names-filter{display:flex;flex-wrap:wrap;gap:.45rem;justify-content:center;margin:1.2rem 0 .4rem}
.names-filter button{background:none;border:1px solid var(--faint);border-radius:999px;color:var(--soft);
  cursor:pointer;font:inherit;font-size:.88rem;padding:.24rem .9rem}
.names-filter button[aria-pressed="true"]{border-color:var(--acc);color:var(--acc)}
td.name{font-family:"Frank Ruhl Libre",serif;font-size:1.25rem;white-space:nowrap}
td.tr{color:var(--soft);font-size:.88rem;white-space:nowrap}
tr.pick{cursor:pointer}
tr.pick:hover td{background:var(--card)}

/* atbash */
.out{max-width:30rem;margin:1.2rem auto 0;background:var(--card);border:1px solid var(--line);
  border-radius:2px;padding:1rem;min-height:5.5rem;font-family:"Frank Ruhl Libre",serif;
  font-size:1.5rem;line-height:1.7;word-break:break-word}
.out.empty{color:var(--soft);font-size:1rem;font-family:"Assistant",sans-serif}

footer.site-foot{margin-top:3.5rem;padding-top:1.2rem;border-top:1px solid var(--faint);
  color:var(--soft);font-size:.87rem;display:flex;flex-wrap:wrap;gap:1.1rem;justify-content:center}
footer.site-foot p{flex-basis:100%;margin:.4rem 0 0;text-align:center}

@media (max-width:560px){
  .wheel{width:15.5rem;height:15.5rem}
  .wheelwrap{min-height:15.5rem}
  .hub .n{font-size:3.4rem}
  .wheel::after{inset:3.9rem}
  .ltr{width:2.1rem;height:2.1rem;margin:-1.05rem 0 0 -1.05rem}
  .ltr b{font-size:1.25rem}
}

.nav{padding:1.5rem 0 1.2rem}
.nav .menu{display:flex;flex-wrap:wrap;gap:.3rem 1.5rem;justify-content:center;
  list-style:none;margin:0;padding:0;font-family:"Bellefair",serif;font-size:1.1rem}
.nav a,.nav .subtoggle{color:var(--soft);text-decoration:none;background:none;border:none;
  font:inherit;cursor:pointer;padding:.15rem 0;display:inline-flex;align-items:center;gap:.25rem}
.nav a:hover,.nav .subtoggle:hover{color:var(--acc)}
.nav a[aria-current],.nav .subtoggle.on{color:var(--ink);border-bottom:1px solid var(--acc)}
.nav .caret{font-size:.7em;transform:translateY(1px)}
.nav .has-sub{position:relative}
.nav .subtoggle[aria-expanded="true"] .caret{transform:translateY(1px) rotate(180deg)}
.nav .sub{position:absolute;top:100%;inset-inline-start:50%;transform:translateX(50%);
  min-width:14rem;background:var(--card);border:1px solid var(--line);border-radius:2px;
  box-shadow:0 6px 18px var(--shadow);list-style:none;margin:.5rem 0 0;padding:.35rem 0;z-index:20;
  font-size:1rem;text-align:right}
.nav .sub li{margin:0}
.nav .sub a{display:block;padding:.4rem 1rem;color:var(--ink)}
.nav .sub a:hover{background:var(--bg);color:var(--acc)}
.nav .sub a[aria-current]{color:var(--acc);border:none}
@media (max-width:640px){
  .nav .menu{gap:.2rem .9rem;font-size:1rem}
  .nav .sub{position:static;transform:none;min-width:0;box-shadow:none;border:none;
    background:none;padding:.1rem 0;text-align:center}
  .nav .sub a{padding:.25rem 0;font-size:.95rem;color:var(--soft)}
  .nav .has-sub{flex-basis:100%;text-align:center}
}

.calc{display:flex;align-items:baseline;justify-content:center;gap:.9rem;flex-wrap:wrap;
  background:var(--card);border:1px solid var(--faint);border-radius:2px;
  padding:.8rem 1rem;margin:.9rem 0}
.calc .cw{font-family:"Frank Ruhl Libre",serif;font-size:1.7rem;line-height:1.2}
.calc .cl{display:flex;gap:.3rem;align-self:center}
.calc .c{text-align:center;min-width:2.1rem;line-height:1.15}
.calc .c b{display:block;font-family:"Frank Ruhl Libre",serif;font-weight:400;font-size:1.2rem}
.calc .c i{display:block;font-style:normal;font-family:"Bellefair",serif;font-size:.78rem;color:var(--acc)}
.calc .ct{font-family:"Frank Ruhl Libre",serif;font-size:1.7rem;line-height:1.2;
  color:var(--acc);font-variant-numeric:tabular-nums}
p.eq{text-align:center;font-family:"Bellefair",serif;font-size:1.5rem;margin:.6rem 0 1.2rem}
.prose sup a{text-decoration:none;font-size:.75em;padding:0 .12em}
.qa{border-bottom:1px solid var(--faint);padding:.55rem 0}
.qa summary{cursor:pointer;font-family:"Bellefair",serif;font-size:1.12rem;list-style:none}
.qa summary::-webkit-details-marker{display:none}
.qa summary::before{content:"+";color:var(--acc);margin-inline-end:.5rem;font-family:"Assistant",sans-serif}
.qa[open] summary::before{content:"–"}
.qa p{margin:.45rem 0 .2rem;color:var(--soft);font-size:.96rem}
ol.sources{font-size:.9rem;color:var(--soft);padding-inline-start:1.3rem}
ol.sources li{margin-bottom:.4rem}
ol.sources a{text-decoration:none}

.tool{background:var(--card);border:1px solid var(--line);border-radius:3px;
  padding:1.4rem 1.2rem 1.6rem;margin:1.6rem 0 2.2rem}
.tool > label{display:block;text-align:center;color:var(--soft);font-size:.9rem;margin-bottom:.5rem}
.tool .inp{background:var(--bg);font-size:1.6rem}
.tool .wheelwrap{min-height:17rem;margin-top:1.1rem;align-items:center}
.tool .wheel{width:16rem;height:16rem}
.tool .wheel::after{inset:3.6rem}
.tool .hub .n{font-size:3.6rem}
.tool .hh{text-align:center;color:var(--soft);font-size:1.1rem;margin:1.6rem 0 .5rem}
.tool .cmp{border-top:1px solid var(--faint)}

footer.site-foot{margin-top:3.5rem;padding-top:1.6rem;border-top:1px solid var(--faint);
  display:block;color:var(--soft);font-size:.9rem}
.fcols{display:flex;flex-wrap:wrap;gap:2rem 3.5rem;justify-content:center}
.fcol h2{font-family:"Bellefair",serif;font-size:1.05rem;font-weight:400;color:var(--ink);
  margin:0 0 .5rem;padding:0;border:none}
.fcol ul{list-style:none;margin:0;padding:0}
.fcol li{margin-bottom:.28rem}
.fcol a{color:var(--soft);text-decoration:none}
.fcol a:hover{color:var(--acc)}
.fservice{display:flex;flex-wrap:wrap;gap:1.4rem;justify-content:center;
  margin-top:1.8rem;padding-top:1rem;border-top:1px solid var(--faint)}
.fservice a{color:var(--soft);text-decoration:none}
.fservice a:hover{color:var(--acc)}
.flink-btn{background:none;border:none;font:inherit;color:var(--soft);cursor:pointer;padding:0}
.flink-btn:hover{color:var(--acc)}
.fnote{text-align:center;margin:1rem 0 0;font-size:.84rem}
@media (max-width:560px){
  .fcols{gap:1.6rem 2rem}
  .fcol{flex-basis:100%;text-align:center}
}

h2.ctr{text-align:center;max-width:36rem;margin-inline:auto}
.cform{max-width:36rem;margin:0 auto}
.cform p{margin:0 0 1rem}
.cform label{display:block;font-size:.9rem;color:var(--soft);margin-bottom:.25rem}
.cform input,.cform select,.cform textarea{
  width:100%;background:var(--card);color:var(--ink);border:1px solid var(--line);
  border-radius:2px;font:inherit;font-size:1rem;padding:.55rem .7rem}
.cform textarea{resize:vertical;line-height:1.6}
.cform input:focus,.cform select:focus,.cform textarea:focus{
  outline:2px solid var(--acc);outline-offset:1px}
.f2{display:flex;gap:1rem}
.f2 p{flex:1}
.fsubmit{text-align:center;margin-top:1.4rem}
.fsmall{text-align:center;font-size:.85rem;color:var(--soft)}
.botcheck{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fstatus{text-align:center;min-height:1.5rem;margin:.4rem 0 0;font-size:.95rem}
.fstatus.ok{color:var(--acc)}
.fstatus.ko{color:var(--ink)}
.cform.sending button{opacity:.55;pointer-events:none}
@media (max-width:520px){ .f2{flex-direction:column;gap:0} }

h2.ctr2{text-align:center}
.vgrid{display:flex;gap:.7rem;align-items:flex-start;margin:0 0 1.2rem}
.vgrid .vt{flex:1;margin:0;border-collapse:collapse;
  background:var(--card);border:1px solid var(--faint);border-radius:2px}
.vgrid .vt caption{font-family:"Bellefair",serif;font-size:1rem;color:var(--soft);
  padding:.45rem 0 .35rem;text-align:center;border-bottom:1px solid var(--faint);caption-side:top}
.vgrid .vt td{border-bottom:1px solid var(--faint);padding:.3rem .6rem;text-align:center}
.vgrid .vt tr:last-child td{border-bottom:none}
.vgrid .vt td.l{font-family:"Frank Ruhl Libre",serif;font-size:1.3rem;width:50%;
  border-inline-start:1px solid var(--faint)}
.vgrid .vt td.v{font-family:"Bellefair",serif;font-size:1.1rem;color:var(--acc);
  font-variant-numeric:tabular-nums;width:50%}
@media (max-width:420px){
  .vgrid{gap:.4rem}
  .vgrid .vt td{padding:.25rem .3rem}
  .vgrid .vt td.l{font-size:1.15rem}
  .vgrid .vt caption{font-size:.9rem}
}

table.sof{max-width:14rem;margin:.9rem auto 1.2rem;border-collapse:collapse;
  background:var(--card);border:1px solid var(--faint);border-radius:2px}
table.sof caption{font-family:"Bellefair",serif;font-size:1rem;color:var(--soft);
  padding-bottom:.45rem;text-align:center}
table.sof td{border-bottom:1px solid var(--faint);padding:.3rem .8rem;text-align:center}
table.sof tr:last-child td{border-bottom:none}
table.sof td.l{font-family:"Frank Ruhl Libre",serif;font-size:1.3rem;width:50%;
  border-inline-start:1px solid var(--faint)}
table.sof td.v{font-family:"Bellefair",serif;font-size:1.1rem;color:var(--acc);
  font-variant-numeric:tabular-nums;width:50%}

.conv{display:flex;gap:1.2rem;flex-wrap:wrap}
.conv .cv{flex:1;min-width:14rem;text-align:center}
.conv .cv > label{display:block;color:var(--soft);font-size:.9rem;margin-bottom:.5rem}
.conv .inp{font-size:1.5rem;padding:.45em .5em}
.conv .cvout{font-family:"Frank Ruhl Libre",serif;font-size:2.4rem;color:var(--acc);
  margin:.7rem 0 .1rem;line-height:1.2;min-height:1.2em;font-variant-numeric:tabular-nums}
.conv .cvsteps{color:var(--soft);font-size:.85rem;margin:0;min-height:1.2em}
table.vt.wide{max-width:16rem;margin:.9rem auto 1.2rem;display:table}
table.vt.wide td{padding:.3rem .9rem}

table.atb{max-width:20rem;margin:1.2rem auto 1.6rem;border-collapse:collapse;
  background:var(--card);border:1px solid var(--faint);border-radius:2px}
table.atb caption{font-family:"Bellefair",serif;font-size:1.15rem;color:var(--soft);
  padding-bottom:.5rem;text-align:center}
table.atb th{font-family:"Bellefair",serif;font-size:.95rem;color:var(--soft);
  font-weight:400;text-align:center;padding:.35rem;border-bottom:1px solid var(--line)}
table.atb td{border-bottom:1px solid var(--faint);padding:.22rem .4rem;text-align:center}
table.atb tr:last-child td{border-bottom:none}
table.atb td.l{font-family:"Frank Ruhl Libre",serif;font-size:1.3rem;width:40%}
table.atb td.a{color:var(--acc);width:20%}
table.cmp2{max-width:34rem;margin:1rem auto 1.4rem;border-collapse:collapse}
table.cmp2 th{font-family:"Bellefair",serif;font-size:1.1rem;color:var(--acc);
  font-weight:400;padding:.4rem .6rem;border-bottom:1px solid var(--line);text-align:right}
table.cmp2 td{border-bottom:1px solid var(--faint);padding:.45rem .6rem;text-align:right;
  font-size:.96rem;width:50%}

.atbgrid{display:flex;gap:1rem;max-width:30rem;margin:1rem auto 0}
.atbgrid .atb{flex:1;margin:0;border-collapse:collapse;
  background:var(--card);border:1px solid var(--faint);border-radius:2px}
.atbgrid .atb td{border-bottom:1px solid var(--faint);padding:.28rem .35rem;text-align:center}
.atbgrid .atb tr:last-child td{border-bottom:none}
.atbgrid .atb td.l{font-family:"Frank Ruhl Libre",serif;font-size:1.2rem;width:38%}
.atbgrid .atb td.l.r{color:var(--acc);font-weight:500}
.atbgrid .atb td.a{color:var(--soft);width:24%;font-size:.85rem}

.atbex{max-width:26rem;margin:1.6rem auto 0;text-align:center}
.atbex .atbex-word{font-family:"Frank Ruhl Libre",serif;font-size:1.9rem;margin:.3rem 0 1rem}
.atbex .atbex-word .arr{color:var(--soft);font-size:1.3rem;margin:0 .4rem}
.atbex .atbex-word .acc{color:var(--acc)}
.atbex-chips{display:flex;justify-content:center;gap:.6rem;flex-wrap:wrap}
.atbex-chips span{background:var(--card);border:1px solid var(--faint);border-radius:2px;
  padding:.35rem .7rem;font-family:"Frank Ruhl Libre",serif;font-size:1.15rem}
.atbex-chips span i{font-style:normal;color:var(--soft);font-size:.85rem;margin:0 .2rem}
.atbex-chips span b.acc{color:var(--acc);font-weight:500}

.atbnote{max-width:30rem;margin:1.4rem auto 0;text-align:center;font-size:.9rem;
  color:var(--soft);border-top:1px solid var(--faint);padding-top:.8rem}

@media (max-width:480px){
  .atbgrid{gap:.5rem}
  .atbgrid .atb td.l{font-size:1.05rem;padding:.24rem .2rem}
  .atbex .atbex-word{font-size:1.55rem}
}

ul.tl{list-style:none;padding:0;margin:.8rem 0 1.4rem;
  border-inline-start:1px solid var(--faint)}
ul.tl li{position:relative;padding:0 1.2rem .9rem 0;margin:0}
ul.tl li::before{content:"";position:absolute;inset-inline-start:-4.5px;top:.55rem;
  width:8px;height:8px;border-radius:50%;background:var(--acc)}
ul.tl li b{display:block;font-family:"Bellefair",serif;font-size:1.1rem;font-weight:400}
ul.tl li span{color:var(--soft);font-size:.95rem}

table.otb{max-width:34rem;margin:1.2rem auto 1.6rem;border-collapse:collapse;
  background:var(--card);border:1px solid var(--faint);border-radius:2px;width:100%}
table.otb caption{font-family:"Bellefair",serif;font-size:1.1rem;color:var(--soft);
  padding:.5rem 0;text-align:center;border-bottom:1px solid var(--line)}
table.otb th{font-family:"Bellefair",serif;font-size:.85rem;color:var(--soft);
  font-weight:400;text-align:center;padding:.4rem .3rem;border-bottom:1px solid var(--line)}
table.otb td{border-bottom:1px solid var(--faint);padding:.28rem .3rem;text-align:center}
table.otb tr:last-child td{border-bottom:none}
table.otb td.name{font-family:"Frank Ruhl Libre",serif;font-size:1.25rem}
table.otb td.val{font-family:"Bellefair",serif;color:var(--acc);font-variant-numeric:tabular-nums}
@media (max-width:480px){
  table.otb th, table.otb td{padding:.24rem .15rem;font-size:.85rem}
  table.otb td.name{font-size:1.05rem}
}

/* couleurs des methodes : valeurs claires par defaut, eclaircies en mode
   sombre pour rester au-dessus du seuil de contraste AA sur fond fonce
   (mesure : 4.6 a 4.9, contre 2.8 a 3.8 avec les valeurs claires telles quelles). */
:root{
  --m-ordinal:#4F7A5A; --m-small:#6E5A3C; --m-large:#B0552E;
  --m-kolel:#8C6A12; --m-milui:#5B6B7A;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --m-ordinal:#5A8E67; --m-small:#977B50; --m-large:#CC5F31;
    --m-kolel:#A27911; --m-milui:#718597;
  }
}
:root[data-theme="dark"]{
  --m-ordinal:#5A8E67; --m-small:#977B50; --m-large:#CC5F31;
  --m-kolel:#A27911; --m-milui:#718597;
}

.toc{max-width:28rem;margin:1.6rem auto 2.2rem;
  border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);
  padding:1rem 0}
.toc-h{font-family:"Bellefair",serif;font-weight:400;font-size:.85rem;
  color:var(--soft);letter-spacing:.12em;margin:0 0 .8rem;padding:0;
  border:none;text-align:center}
.toc ol{list-style:none;margin:0;padding:0;counter-reset:toc}
.toc li{counter-increment:toc;display:flex;align-items:baseline;padding:.32rem 0}
.toc li::before{content:counter(toc, hebrew) ".";color:var(--acc);
  margin-inline-start:.7rem;font-family:"Frank Ruhl Libre",serif;
  font-size:.95rem;min-width:1.5rem;text-align:center}
.toc a{color:var(--ink);text-decoration:none;font-family:"Frank Ruhl Libre",serif;font-size:1.05rem}
.toc a:hover{color:var(--acc)}

table.cmp3{max-width:38rem;margin:1.2rem auto 1.6rem;border-collapse:collapse;width:100%}
table.cmp3 caption{font-family:"Bellefair",serif;font-size:1.1rem;color:var(--soft);
  padding-bottom:.5rem;text-align:center}
table.cmp3 th{font-family:"Bellefair",serif;font-size:.88rem;color:var(--acc);
  font-weight:400;text-align:right;padding:.4rem .5rem;border-bottom:1px solid var(--line)}
table.cmp3 td{border-bottom:1px solid var(--faint);padding:.45rem .5rem;text-align:right;font-size:.92rem}
table.cmp3 td.name{font-family:"Frank Ruhl Libre",serif;font-size:1.1rem;white-space:nowrap}

/* pastille de couleur : un span inline genere par dot(), reprenant la
   couleur assignee a chaque methode. La meme pastille reapparait devant
   les titres h2/h3 de la methode correspondante plus bas sur la page. */
.mdot{display:inline-block;width:.62rem;height:.62rem;border-radius:50%;
  margin-inline-end:.5rem;vertical-align:middle}
h2 .mdot, h3 .mdot{margin-inline-end:.6rem}

/* a l'interieur d'un bloc .mc, les resultats chiffres (calcbox et lignes
   d'equation) reprennent la couleur --mc de la methode au lieu du
   vermillon par defaut du site ; ceci reste local a cette page. */
.mc{--mc: var(--acc)}
.mc .calc .ct{color:var(--mc)}
.mc p.eq{color:var(--mc)}
.mc .eqbox{color:var(--mc)}

.eqbox{background:var(--card);border:1px solid var(--faint);border-radius:2px;
  padding:.7rem 1rem;margin:.7rem auto;max-width:20rem;text-align:center;
  font-family:"Frank Ruhl Libre",serif;font-size:1.5rem}

.snapbox{max-width:34rem;margin:1.6rem auto 2rem;background:var(--card);
  border:1px solid var(--faint);border-radius:4px;padding:1.1rem 1rem 1.3rem}
.snap-row{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin-top:.6rem}
.snap-c{flex:1 1 5.5rem;min-width:5.5rem;text-align:center;background:var(--bg);
  border:1px solid var(--faint);border-radius:3px;padding:.6rem .3rem}
.snap-v{display:block;font-family:"Bellefair",serif;font-size:1.7rem;color:var(--mc, var(--acc));
  font-variant-numeric:tabular-nums;line-height:1.1}
.snap-l{display:block;font-size:.78rem;color:var(--soft);margin-top:.3rem;line-height:1.25}
@media (max-width:480px){
  .snap-c{flex:1 1 40%}
}

.cc-banner{
  position:fixed; inset-inline:0; bottom:0; z-index:100;
  background:var(--card); border-top:1px solid var(--line);
  box-shadow:0 -4px 18px var(--shadow);
  padding:1rem 1.2rem; padding-bottom:calc(1rem + env(safe-area-inset-bottom,0px));
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:1rem;
}
.cc-banner .cc-text{margin:0;max-width:38rem;font-size:.92rem;color:var(--soft);flex:1 1 20rem}
.cc-banner .cc-text a{color:var(--acc)}
.cc-banner .cc-actions{display:flex;gap:.6rem;flex:none}
@media (max-width:480px){
  .cc-banner{padding:.9rem 1rem .9rem calc(1rem + env(safe-area-inset-bottom,0px))}
  .cc-banner .cc-actions{width:100%;justify-content:center}
}