/* Written, Sent, Not Counted. Two witnesses on one night: the stream's (teal) above the line,
   Bluesky's own index (ink blue) below it, and what is missing drawn as an outline in amber. */
:root {
  --ground:#f1efe8; --ground-2:#e6e3d9; --ink:#1b1f26; --ink-soft:#575d68; --rule:#cfcabd; --rule-strong:#a9a393;
  --witness:#156b65; --index:#2d5aa8; --missing:#a34410; --band:rgba(194,88,27,.10); --link:#2b54a0; --ok:#176139; --no:#963513;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ground:#0d1014; --ground-2:#151a20; --ink:#e7e9ec; --ink-soft:#9aa3ae; --rule:#2a313a; --rule-strong:#46505c;
    --witness:#4cc7bd; --index:#7ea8f0; --missing:#f0965a; --band:rgba(240,150,90,.12); --link:#8db3f2; --ok:#5fd394; --no:#f0965a;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --ground:#0d1014; --ground-2:#151a20; --ink:#e7e9ec; --ink-soft:#9aa3ae; --rule:#2a313a; --rule-strong:#46505c;
  --witness:#4cc7bd; --index:#7ea8f0; --missing:#f0965a; --band:rgba(240,150,90,.12); --link:#8db3f2; --ok:#5fd394; --no:#f0965a;
  color-scheme: dark;
}
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--ground); color:var(--ink); font-family:"Fraunces",Georgia,serif; line-height:1.62; font-size:1.06rem; }
main { max-width:46rem; margin:0 auto; padding:4.6rem 1rem 3rem; }
a { color:var(--link); text-underline-offset:2px; }
:focus-visible { outline:2px solid var(--missing); outline-offset:2px; }
p { margin:0 0 1rem; }
.kicker, label, button, select, input, .readout, figcaption, table, .mono, .cap, code, .rows { font-family:"Martian Mono",ui-monospace,SFMono-Regular,Menlo,monospace; }
.kicker { font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); margin:0 0 .9rem; }
h1 { font-size:clamp(2.4rem,9vw,4.2rem); line-height:.98; margin:0 0 1rem; letter-spacing:-.02em; font-weight:600; }
.dek { font-size:1.12rem; margin:0 0 2rem; }
h2 { font-size:1.55rem; line-height:1.2; margin:3.2rem 0 1rem; font-weight:600; letter-spacing:-.01em; }
h2.ih { margin-top:0; font-size:1.2rem; }
h3 { font-size:1.02rem; margin:0 0 .5rem; }
code { font-size:.86em; background:var(--ground-2); padding:.05em .3em; border-radius:3px; }
pre { overflow-x:auto; background:var(--ground-2); border:1px solid var(--rule); border-radius:6px; padding:.8rem .9rem; font-size:.8rem; line-height:1.5; }
pre code { background:none; padding:0; }
ul { padding-left:1.2rem; margin:0 0 1.2rem; }
li { margin:0 0 .55rem; }
.instrument { border:1px solid var(--rule-strong); border-radius:10px; padding:1.1rem clamp(.8rem,3vw,1.3rem) 1rem; margin:2rem 0; background:var(--ground-2); }
.instrument.small { padding-top:.9rem; }
.lede { font-size:.98rem; }
svg { display:block; width:100%; height:auto; margin:.6rem 0 .4rem; overflow:visible; }
svg text { font-family:"Martian Mono",ui-monospace,monospace; fill:var(--ink-soft); }
.cap { font-size:.72rem; line-height:1.55; color:var(--ink-soft); margin:.4rem 0 .6rem; }
.readout { font-size:.82rem; line-height:1.5; margin:.5rem 0 .3rem; }
.controls { display:flex; flex-wrap:wrap; gap:.5rem .6rem; align-items:center; margin:.8rem 0 .4rem; }
.controls label { flex-basis:100%; font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); }
select, input[type=text] { font-size:.85rem; padding:.45rem .55rem; border:1px solid var(--rule-strong); border-radius:6px; background:var(--ground); color:var(--ink); min-width:0; }
input[type=text] { flex:1 1 14rem; }
select { flex:1 1 14rem; }
button { font-size:.8rem; padding:.48rem .95rem; border:1px solid var(--ink); border-radius:6px; background:var(--ink); color:var(--ground); cursor:pointer; }
button:disabled, select:disabled, input:disabled { opacity:.5; cursor:not-allowed; }
.tablewrap { overflow-x:auto; margin:1rem 0 1.2rem; }
table { border-collapse:collapse; width:100%; font-size:.78rem; }
caption { text-align:left; font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); padding:0 0 .5rem; }
th, td { padding:.42rem .5rem; border-bottom:1px solid var(--rule); text-align:right; font-variant-numeric:tabular-nums; }
th[scope=row], thead th:first-child { text-align:left; font-weight:400; }
thead th { font-weight:600; color:var(--ink-soft); border-bottom-color:var(--rule-strong); }
tr.gap td:last-child { color:var(--missing); font-weight:600; }
tr.gap { background:var(--band); }
.edges li { font-size:1rem; }
.rows { list-style:none; padding:0; margin:.5rem 0; font-size:.74rem; max-height:22rem; overflow-y:auto; }
.rows li { display:grid; grid-template-columns:6.4rem 1fr 1fr; gap:.4rem; padding:.28rem .2rem; border-bottom:1px solid var(--rule); margin:0; }
.rows li.head { color:var(--ink-soft); text-transform:uppercase; letter-spacing:.06em; font-size:.62rem; }
.yes { color:var(--ok); } .no { color:var(--no); font-weight:600; }
#mine-list { font-family:"Martian Mono",ui-monospace,monospace; font-size:.76rem; }
#mine-list h3 { font-family:"Fraunces",Georgia,serif; font-size:.98rem; margin:1rem 0 .3rem; }
#mine-list ul { list-style:none; padding:0; }
#mine-list li { padding:.2rem 0; border-bottom:1px solid var(--rule); margin:0; overflow-wrap:anywhere; }
.check { border-left:3px solid var(--witness); background:var(--ground-2); padding:.9rem 1.1rem; margin:2.6rem 0 1rem; }
.check h2 { font-family:"Martian Mono",ui-monospace,monospace; font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; color:var(--witness); margin:0 0 .5rem; }
.foot { margin-top:2.4rem; font-size:.9rem; }
@media (max-width:30rem) {
  main { padding-top:4rem; }
  .rows li { grid-template-columns:5.6rem 1fr 1fr; font-size:.68rem; }
  th, td { padding:.38rem .3rem; font-size:.72rem; }
}