/* Arithmetica: the Elementa palette and type (cool gray, Libre Caslon), sized like Ars Rhetorica's home page */
:root,[data-theme=light]{
  --bg:#e9ecf0; --panel:#ffffff; --panel2:#dde2e9; --ink:#0b1220; --muted:#28313e;
  --rule:#4b5563; --accent:#8e1219; --accent2:#143a80;
  --el-sub:#28313e; --el-hover:#dde2e9;
}
[data-theme=dark]{
  --bg:#14161a; --panel:#1b1e24; --panel2:#22262e; --ink:#e8e3d9; --muted:#9aa0ab;
  --rule:#737c8a; --accent:#ff8f6b; --accent2:#7fb2ff;
  --el-sub:#d4cfc6; --el-hover:#2a2f38;
}
:root{--serif:'Libre Caslon Text','Iowan Old Style','Palatino Linotype',Palatino,Georgia,'STIX Two Text','Cambria Math',serif;
  --display:'Libre Caslon Display','Libre Caslon Text',Georgia,serif;
  --sans:ui-sans-serif,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}
*{box-sizing:border-box}
html{overflow-x:hidden;scroll-padding-top:16px}
body{margin:0;background:var(--bg);color:var(--ink);font:21px/1.6 var(--serif);overflow-x:clip;
  -webkit-text-size-adjust:100%;text-size-adjust:100%}
a{color:var(--accent)}
button{font-family:var(--serif)}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
/* floating control, top right: light/dark */
.el-float{position:fixed;top:14px;right:16px;display:flex;gap:10px;z-index:70}
.el-btn{font:400 20px var(--serif);color:var(--ink);background:var(--bg);border:2px solid var(--rule);
  border-radius:10px;padding:6px 14px;min-height:46px;min-width:48px;cursor:pointer}
.el-btn:hover,.el-btn:focus-visible{background:var(--el-hover);outline:3px solid var(--accent);outline-offset:2px}
/* the thin line above a section page: back and part */
.el-deckline{display:grid;grid-template-columns:minmax(170px,1fr) minmax(0,780px) minmax(170px,1fr);align-items:center;
  gap:12px;padding:8px 16px 6px;min-height:64px}
.el-back{font:400 19px var(--serif);color:var(--muted);text-decoration:none;padding:8px 4px;white-space:nowrap;justify-self:start}
.el-back:hover,.el-back:focus-visible{color:var(--accent)}
.el-title{font-variant:small-caps;letter-spacing:.04em;font-size:30px;line-height:1.2;text-align:center;color:var(--ink);
  -webkit-text-stroke:.35px currentColor;text-wrap:balance}
/* home */
.el-page{max-width:860px;margin:0 auto;padding:72px 24px 70px}
.el-head{text-align:center}
.el-orn{color:var(--accent);font-size:18px;line-height:1;margin:0 auto 28px}
.el-h1{font:400 64px/1 var(--display);margin:0 0 4px;color:var(--ink)}
.ar-doctitle{font:400 28px/1.25 var(--display);margin:18px 0 6px;text-wrap:balance}
.el-sub{font-style:italic;font-size:20px;color:var(--el-sub);margin:0;text-wrap:balance}
.el-rule{height:2px;background:var(--rule);margin:26px 0}
.el-note{border:2px solid var(--rule);background:var(--panel2);border-radius:10px;padding:16px 20px;margin:22px 0}
.el-h2{font-size:28px;font-weight:400;margin:34px 0 12px}
.el-h2.big{font:400 44px/1.15 var(--display);text-align:center;margin:48px 0 14px}
.el-sec{font-size:28px;font-weight:400;margin:34px 0 10px;border-bottom:2px solid var(--rule);padding-bottom:6px}
.ar-front ol,.ar-front ul,.ar-item ol,.ar-item ul,.ar-lead ol{padding-left:1.6em;margin:.5em 0}
.ar-front li,.ar-item li{margin:.35em 0;padding-left:.2em}
.ar-front li::marker,.ar-item li::marker{color:var(--accent)}
.ar-frontbody p{margin:.6em 0}
.ar-part{font-size:17px;letter-spacing:.08em;text-transform:uppercase;font-weight:400;color:var(--accent);
  margin:38px 0 10px;border-bottom:2px solid var(--rule);padding-bottom:6px}
.el-books{display:flex;flex-direction:column;gap:14px;margin-top:10px}
.el-book{display:flex;flex-direction:column;gap:4px;padding:16px 22px;border:2px solid var(--rule);
  border-radius:12px;color:var(--ink);text-decoration:none;background:var(--panel2)}
a.el-book:hover,a.el-book:focus-visible{border-color:var(--accent);outline:3px solid var(--accent);outline-offset:2px}
.el-bk{font-size:17px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin:0}
.el-bt{font-size:26px;line-height:1.25}
.el-go{font-size:19px;color:var(--accent);margin-top:4px}
/* section page */
.el-secpage{max-width:900px;padding-top:12px}
.ar-sechead{text-align:center;margin-bottom:22px}
.ar-sechead .el-h1{font-size:44px;line-height:1.12;text-wrap:balance;margin:6px 0 8px}
.ar-lead{margin:0 0 18px}
.ar-item{border:2px solid var(--rule);border-radius:14px;background:var(--panel);padding:14px 22px;margin:18px 0;
  scroll-margin-top:16px}
.ar-item:target{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}
.ar-item p{margin:.55em 0;overflow-wrap:anywhere}
.ar-item>p:first-child strong:first-child{color:var(--accent)}
.ar-item.ar-definition{background:var(--panel2)}
p.fm{padding-left:1.4em;margin:.35em 0}
.tab{display:inline-block;width:2em}
/* previous / all / next under the section */
.el-pager{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;max-width:1000px;margin:0 auto;padding:6px 16px 60px}
.el-pg{font:400 20px var(--serif);color:var(--ink);background:var(--panel2);border:2px solid var(--rule);border-radius:10px;
  padding:8px 18px;min-height:48px;display:flex;flex-direction:column;align-items:center;text-align:center;
  text-decoration:none;max-width:min(100%,22em)}
.el-pg small{font-size:16px;color:var(--el-sub)}
.el-pg.nx{background:var(--accent);border-color:var(--accent);color:var(--bg)}
.el-pg.nx small{color:var(--bg)}
.el-pg:hover,.el-pg:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
/* concordance */
.ar-conc{border-collapse:collapse;margin:0 auto;font-size:20px;columns:auto}
.ar-conc{display:block;columns:4 9em;column-gap:28px}
.ar-conc thead{display:none}
.ar-conc tbody{display:contents}
.ar-conc tr{display:flex;gap:14px;break-inside:avoid;border-bottom:1px solid var(--rule);padding:4px 6px}
.ar-conc td:first-child{min-width:4.2em;color:var(--el-sub)}
.ar-conc td:last-child::before{content:'Thm ';color:var(--el-sub);font-size:.85em}
@media (max-width:900px){
  .el-float{position:absolute}
  .el-deckline{display:flex;flex-wrap:wrap;justify-content:flex-start;padding:76px 16px 8px}
  .el-title{order:3;flex-basis:100%;font-size:26px}
  .el-page{padding-top:118px}
  .el-secpage{padding-top:12px}
}
/* Home title sizes match Ars Rhetorica #scr-home h1 */
@media (max-width:600px){
  .el-head .el-h1{font-size:40px}
  .ar-doctitle{font-size:24px}
  .el-h2.big{font-size:34px}
  .ar-sechead .el-h1{font-size:34px}
  .el-page{padding-left:16px;padding-right:16px}
  .ar-item{padding:10px 14px}
  .ar-conc{columns:2 8em}
}
@media (max-width:520px){ .el-head .el-h1{font-size:32px} }
@media print{ .el-float,.el-pager,.el-deckline{display:none} .ar-item{break-inside:avoid} }
/* a corollary sits under its axiom, not counted with the axioms */
li p.cor{margin:.4em 0 .4em 1.2em}
