diff --git a/style/counters.css b/style/counters.css
index 5e8d356..6821348 100644
--- a/style/counters.css
+++ b/style/counters.css
@@ -1,5 +1,19 @@
-:root {
-  --section-prefix: '';
+@counter-style circled {
+  system: fixed;
+  symbols: "\2460" "\2461" "\2462" "\2463" "\2464" "\2465" "\2466" "\2467"
+           "\2468" "\2469" "\246A" "\246B" "\246C" "\246D" "\246E" "\246F"
+           "\2470" "\2471" "\2472" "\2473";
+  speak-as: numbers;
+  suffix: " ";
+}
+
+@counter-style inv-circled {
+  system: fixed;
+  symbols: "\278A" "\278B" "\278C" "\278D" "\278E" "\278F" "\2790" "\2791"
+           "\2792" "\2793" "\24EB" "\24EC" "\24ED" "\24EE" "\24EF" "\24F0"
+           "\24F1" "\24F2" "\24F3" "\24F4";
+  speak-as: numbers;
+  suffix: " ";
 }
 
 main :is(h1, h2, h3, h4, h5, h6):not(.unnumbered)::before {
@@ -9,40 +23,46 @@ main :is(h1, h2, h3, h4, h5, h6):not(.unnumbered)::before {
 main h1:not(.unnumbered) { counter-increment: h1; }
 main h1 { counter-reset: h2 h3 h4 h5 h6; }
 main h1:not(.unnumbered)::before {
-  content: var(--section-prefix) counter(h1);
+  content: counter(h1, inv-circled);
 }
+main h1.unnumbered::before {
+  content: "\2B8A  ";
+}
+
+/*
 
 main h2:not(.unnumbered) { counter-increment: h2; }
 main h2:not(.unnumbered)::before {
-  content: var(--section-prefix) counter(h1) '.' counter(h2);
+  content: counter(h1) '.' counter(h2);
 }
 main h2 { counter-reset: h3 h4 h5 h6; }
 
 main h3:not(.unnumbered) { counter-increment: h3; }
 main h3 { counter-reset: h4 h5 h6; }
 main h3:not(.unnumbered)::before {
-  content: var(--section-prefix) counter(h1) '.' counter(h2) '.' counter(h3);
+  content: counter(h1) '.' counter(h2) '.' counter(h3);
 }
 
 main h4:not(.unnumbered) { counter-increment: h4; }
 main h4 { counter-reset: h5 h6; }
 main h4:not(.unnumbered)::before {
-  content: var(--section-prefix)
+  content:
     counter(h1) '.' counter(h2) '.' counter(h3) '.' counter(h4);
 }
 
 main h5:not(.unnumbered) { counter-increment: h5; }
 main h5 { counter-reset: h6; }
 main h5:not(.unnumbered)::before {
-  content: var(--section-prefix)
+  content:
     counter(h1) '.' counter(h2) '.' counter(h3) '.' counter(h4) '.'
     counter(h5);
 }
 
 main h6:not(.unnumbered) { counter-increment: h6; }
 main h6:not(.unnumbered)::before {
-  content: var(--section-prefix)
+  content:
     counter(h1) '.' counter(h2) '.' counter(h3) '.' counter(h4) '.'
     counter(h5) '.' counter(h6);
 }
 
+*/
diff --git a/style/page.css b/style/page.css
index 273113e..f71857f 100644
--- a/style/page.css
+++ b/style/page.css
@@ -1,93 +1,108 @@
+@import url(counters.css);
 @import url(fonts/schola/schola.css);
 @import url(fonts/muller/muller.css);
 @import url(fonts/junius/junius.css);
 @import url(fonts/pragmatapro/pragmatapro.css);
 
 :root {
-  --root-col: hsl(30deg, 5%, 26%);
-  --fg-col:   hsl(336deg, 17%, 11%);
-  --bg-col:   hsl(40deg, 91%, 98%);
-  --link-col: hsl(355deg, 52%, 48%);
-
   --ipa-font: JuniusX;
+
+  --light: #feb;
+  --dark:  #325;
+  --mid:   #83869e;
+  --red1:  #f42;
+  --red2:  #d16;
+
+  --fg:  var(--dark);
+  --bg:  var(--light);
+  --accent: var(--red1);
+  --other-accent: var(--red2);
 }
 
 :root {
-  background: var(--root-col);
+  background: var(--bg);
+  color: var(--fg);
 
-  font-family: schola;
-  font-size: 16pt;
-
-  height: 100vh;
+  font-family: PragmataPro;
+  font-size: 13pt;
 }
 
-body {
-  background: url(paper.png), var(--bg-col);
-  background-blend-mode: multiply;
-  color: var(--fg-col);
-  box-shadow: 0 0 5em var(--fg-col);
+@media (prefers-color-scheme: dark) {
+  :root {
+    --fg: var(--light);
+    --bg: var(--dark);
+    --accent: var(--red2);
+    --other-accent: var(--red1);
+  }
+}
+
+:root, body { margin: 0; padding: 0; }
+
+main {
+  border-bottom: 2px dotted var(--fg);
 
   max-width: 50em;
   min-height: 100%;
-  margin: 0 auto;
-  padding: 1em 2em 3em;
+  margin: 1em auto 0;
+  padding: 0.5em 2em;
+
+  line-height: 150%;
 
   box-sizing: border-box;
 }
 
 header {
   text-align: center;
+  text-wrap: balance;
+  background: var(--fg);
+  color: var(--bg);
+  --accent: var(--other-accent);
+  padding: 1em;
 }
 
 header h1 {
   font-size: 250%;
-  font-weight: 200;
-  margin-top: 0;
-}
-
-h1, h2, h3, h4, h5, h6 {
-  margin: 1em 0 0.25em;
-  font-family: Muller;
-  clear: both;
+  margin: 0;
 }
 
+/* h1, h2, h3, h4, h5, h6 { */
 h1 {
-  font-size: 150%;
-  font-weight: 300;
-}
+  margin: 1em 0 0.25em;
 
-h2 {
-  font-size: 140%;
-  font-weight: 300;
-}
+  font-weight: normal;
+  font-variant-east-asian: full-width;
+  -moz-font-feature-settings: "fwid";
+  -webkit-font-feature-settings: "fwid";
+  font-feature-settings: "fwid";
 
-h3 {
-  font-size: 130%;
-  font-weight: 300;
-}
+  clear: both;
 
-h4 {
-  font-size: 120%;
-  font-weight: 300;
-}
-
-h5 {
-  font-size: 110%;
-  font-weight: 400;
-}
-
-h6 {
   font-size: 100%;
-  font-weight: 600;
 }
 
-header h1 {
-  margin-bottom: 0.5rem;
+h1 { font-size: 125%; }
+h2 { font-size: 125%; }
+h3 { font-size: 120%; }
+h4 { font-size: 110%; }
+h5 { font-size: 100%; }
+h6 { font-size: 100%; }
+
+main h1 {
+  background: var(--fg);
+  color: var(--bg);
+  padding: 0.25rem 0.75rem;
+  margin-bottom: 1rem;
+}
+
+main :is(h2, h3, h4, h5, h6) {
+  padding: 0.25rem 0.75rem;
+  border-bottom: 2px dotted var(--fg);
+  margin-bottom: 1rem;
 }
 
 hr {
-  border: 1px solid var(--root-col);
-  width: 80%;
+  border: none;
+  border-bottom: 2px dotted var(--fg);
   height: 0;
 }
 
@@ -96,21 +111,21 @@ pre + hr {
 }
 
 .meta {
+  margin-top: 1rem;
   display: flex;
-  column-gap: 1em;
+  column-gap: 2em;
   align-items: baseline;
   justify-content: center;
 }
 
 header .date {
-  font-size: 80%;
-  font-weight: 400;
-  font-style: italic;
-  margin-top: 0;
-}
+  font-variant-east-asian: normal;
+  -moz-font-feature-settings: normal;
+  -webkit-font-feature-settings: normal;
+  font-feature-settings: normal;
+  font-size: 100%;
 
-.tags {
-  font-size: 80%;
+  margin: 0;
 }
 
 .tags ul {
@@ -155,8 +170,10 @@ header .date {
 
 
 a {
-  color: var(--link-col);
+  color: inherit;
+  text-decoration: 2px dotted underline var(--accent);
 }
+a:hover { color: var(--accent); }
 
 b, strong {
   font-weight: 600;
@@ -167,15 +184,15 @@ dfn {
   font-weight: 500;
 }
 
-ul li {
-  list-style: '— ';
-}
+ul li { list-style: '❀ '; }
+.post-list li { list-style: '✒ '; }
+.tag-list li { list-style: ' '; } /* a tag in pragmatapro */
 
 table {
   margin: auto;
   border-spacing: 0;
-  border-top: 2px solid var(--root-col);
-  border-bottom: 2px solid var(--root-col);
+  border-top: 2px solid var(--fg);
+  border-bottom: 2px solid var(--fg);
 }
 
 th {
@@ -183,7 +200,7 @@ th {
 }
 
 thead th {
-  border-bottom: 1px solid var(--root-col);
+  border-bottom: 1px solid var(--fg);
 }
 
 td, th {
@@ -193,7 +210,7 @@ td, th {
 
 code {
   font-family: PragmataPro;
-  font-size:   90%;
+  font-size:   inherit;
 }
 
 pre {
@@ -201,13 +218,13 @@ pre {
   width:      min-content;
   margin:     0.5em auto;
   padding:    0.5em 0.8em;
-  border:     1px solid var(--root-col);
+  border:     1px solid var(--fg);
   background: hsla(0deg, 0%, 100%, 40%);
 }
 
 
 .ipa, .lang, .ebnf-t {
-  font-family: var(--ipa-font);
+  /* font-family: var(--ipa-font); */
 
   font-feature-settings:
     "ccmp", "calt", "liga", "loca", "mark", "mkmk", "ss01";
@@ -218,26 +235,30 @@ pre {
   text-underline-offset: 0.125em;
 }
 
-.ipa {
-  font-weight: 500;
+.lang, .ebnf-t { font-weight: 500; }
+
+.abbr-list dt {
+  font-family: PragmataPro;
+  font-weight: normal;
 }
 
-.lang, .ebnf-t {
-  font-weight: 700;
-}
-
-.gloss .abbr {
-  font-size: 70%;
-  font-weight: bold;
+.gloss .abbr, .abbr-list dt {
+  font-variant: all-small-caps;
 }
 
 .scr {
   height: 1.5em;
   vertical-align: -40%;
-  padding-right: 0.5ex;
+  margin-right: 0.5ex;
+  padding: 2px;
+  background: var(--light);
 }
 
-.gloss .scr {
+.gloss-split, .gloss-gloss {
+  font-size: 80%;
+}
+
+:is(.gloss, .bigscr) .scr {
   height: 2em;
 }
 
@@ -294,22 +315,20 @@ blockquote {
   font-size: 125%;
 }
 
-main nav {
-  text-align: center;
-  font-size: 125%;
-}
 
-
-#toc > h2 {
-  font-size: 120%;
-  font-weight: 300;
-}
 #toc > ul {
   columns: 2;
   margin-left:  2em;
   margin-right: 2em;
+  > li { list-style: circled; }
 }
 
+figure img {
+  max-width: 100%;
+}
+figure img:not(.scr) {
+  border: 3px solid currentcolor;
+}
 figure:not(.left) {
   text-align: center;
 }
@@ -337,23 +356,31 @@ figure li {
 figcaption {
   font-size: 80%;
   font-style: italic;
-  margin: auto;
+  margin: 0 auto;
 }
 :not(.floating) > figcaption {
   width: 75%;
 }
-
-dt { font-weight: 500; float: left; clear: left; }
-dd { margin-left: 4em; }
+figcaption:first-child { margin-bottom: 0.5em; }
+figcaption:last-child  { margin-top:    0.5em; }
 
 dt {
+  font-weight: 500;
+  display: inline;
   break-after: avoid;
 }
 
 dd {
+  margin-left: 1em;
+  display: inline;
   break-before: avoid;
 }
 
+dd::after {
+  content: '';
+  display: block;
+}
+
 u u {
   text-decoration: double underline;
 }
@@ -384,14 +411,30 @@ u u {
 
 footer {
   clear: both;
-  margin: 1.5em auto 1em;
-  padding-top: 0.5em;
+  margin: 1.5em auto 3em;
 
   font-size: 80%;
   font-weight: 500;
   text-align: center;
 }
 
+footer ul::before {
+  margin: 0;
+  content: '➸ ';
+}
+
+footer ul::after {
+  margin: 0;
+  content: ' 🐌︎';
+}
+
+footer li {
+  display: inline;
+  list-style: none;
+}
+footer li + li::before { content: ' · '; }
+
+
 .ebnf {
   border: none;
 }
@@ -446,10 +489,10 @@ blockquote {
 
 aside {
   margin: 0.5em 3em;
-  padding-left: 1em;
 }
 aside:not(.no-line) {
-  border-left: 2px solid var(--root-col);
+  padding-left: 1em;
+  border-left: 2px solid var(--fg);
 }
 
 aside > details summary {
@@ -538,15 +581,29 @@ aside.floating :last-child { margin-bottom: 0; }
 }
 */
 
+math[display=block] {
+  border: 2px dotted var(--fg);
+
+  padding: 1em 3em;
+  margin: auto;
+  width: min-content;
+
+}
+.rulebox math[display=block] {
+  border: none;
+  padding: 0;
+}
+
 .texdefs {
   display: none;
 }
 
 .rulebox {
   float: right;
-  border: 1px solid var(--root-col);
+  border: 1px solid var(--fg);
   background: #ffffff66;
   padding: .4em 1.2em;
+  margin-left: 3em;
 }
 
 /* the last thing in the :is is for priority fuckery */
@@ -562,3 +619,8 @@ mark {
   background: #fbc;
   padding: 0 0.35ch;
 }
+
+.light {
+  background: var(--light);
+  color: var(--dark);
+}
diff --git a/templates/foot.html b/templates/foot.html
index 566fc81..2af6f48 100644
--- a/templates/foot.html
+++ b/templates/foot.html
@@ -1,8 +1,10 @@
 $if(hide-footer)$$else$
 <footer>
-  <hr>
-  <a href=/index.html>all posts</a> ·
-  <a href=/all-tags.html>all tags</a>
+  <ul>
+    <li><a href=/index.html>all posts</a>
+    <li><a href=/all-tags.html>all tags</a>
+    <li><a href=/rss.xml>rss</a>
+  </ul>
 </footer>
 $endif$
 
diff --git a/templates/head.html b/templates/head.html
index 0622dab..0f587d5 100644
--- a/templates/head.html
+++ b/templates/head.html
@@ -3,9 +3,6 @@
 <meta charset=utf-8>
 
 <link rel=stylesheet href=/style/page.css>
-$if(show-toc)$
-<link rel=stylesheet href=/style/counters.css>
-$endif$
 $for(css)$
 <link rel=stylesheet href=/style/$css$>
 $endfor$
diff --git a/templates/post.html b/templates/post.html
index e525826..ef4a570 100644
--- a/templates/post.html
+++ b/templates/post.html
@@ -6,7 +6,7 @@ $head()$
   $endif$
   <div class=meta>
     $if(date)$
-    <h2 class=date>$date$</h2>
+    <span class=date>$date$</span>
     $endif$
     $if(tags)$
     <nav class=tags>
@@ -19,18 +19,17 @@ $head()$
     </nav>
     $endif$
   </div>
-  <hr>
 </header>
 
-
+<main>
 $if(show-toc)$
 <nav id=toc>
-  <h2>contents</h2>
+  <h1 class=unnumbered>contents</h1>
   $table-of-contents$
 </nav>
+<hr>
 
 $endif$
-<main>
 $body$
 </main>