:root{color-scheme:dark;--paper:#20211d;--ink:#f3f0e7;--muted:#b9b9ae;--line:#4b4d42;--accent:#e7cf48;--seen:#b4cf9f;font-family:system-ui,sans-serif;background:var(--paper);color:var(--ink);font-size:16px;line-height:1.6}
*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:.25em}button,input,select{font:inherit}button,.file-button,select{background:transparent;border:1px solid var(--line);color:var(--ink);border-radius:.4rem;padding:.6rem 1rem;cursor:pointer}button:hover,.file-button:hover{border-color:var(--accent);color:var(--accent)}button:disabled{opacity:.5;cursor:default}:focus-visible{outline:3px solid var(--accent);outline-offset:4px}::selection{color:var(--paper);background:var(--accent)}header,main,footer{max-width:1024px;margin:auto;padding:2rem clamp(1rem,4vw,3rem)}header{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;border-bottom:1px solid var(--line)}.brand{font-family:Georgia,serif;font-size:2rem;text-decoration:none;line-height:1.1}.brand span{display:block;font: .8rem system-ui,sans-serif;color:var(--muted);margin-top:.5rem}.file-button{position:relative;font-size:.9rem}.file-button input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.file-button:focus-within{outline:3px solid var(--accent);outline-offset:4px}h1{font:clamp(2.5rem,6vw,4.5rem)/1.08 Georgia,serif;letter-spacing:-.035em;text-wrap:balance;margin:1rem 0 1.5rem;overflow-wrap:anywhere}p{max-width:70ch}#welcome{padding:3rem 0 6rem}#welcome p{max-width:42ch;color:var(--muted)}.toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:1rem;margin:2rem 0}select{margin-inline-start:.5rem;background:var(--paper)}#counts,.meta,.note,footer{color:var(--muted)}#entries{list-style:none;padding:0;margin:0}#entries>li{border-top:1px solid var(--line);padding:1.4rem 0}.entry{display:grid;grid-template-columns:2.3rem 1fr;gap:1rem}.ordinal{color:var(--muted);font-variant-numeric:tabular-nums;padding-top:.3rem}.entry-body{min-width:0}.entry h2{font-size:1.35rem;line-height:1.35;margin:0 0 .3rem;font-weight:600;overflow-wrap:anywhere}.meta{font-size:.9rem;margin:0}.comment{white-space:pre-wrap;overflow-wrap:anywhere;margin:.8rem 0 0}.poster{float:inline-end;width:72px;aspect-ratio:2/3;object-fit:cover;margin:0;margin-block-end:1rem;margin-inline-start:1rem;border-radius:.25rem}.state{color:var(--accent)}.state.seen{color:var(--seen)}details{margin-top:.9rem}summary{cursor:pointer;color:var(--accent);width:fit-content}details ul{padding-inline-start:1.2rem}details li{margin:.8rem 0;overflow-wrap:anywhere}.note{font-size:.9rem;margin-top:3rem}footer{border-top:1px solid var(--line);font-size:.8rem;padding-bottom:3rem}.skip{position:absolute;top:-100px;background:var(--accent);color:var(--paper);padding:1rem}.skip:focus{top:0}#status:not(:empty){padding:1rem;border:1px solid var(--line)}[hidden]{display:none!important}@media(max-width:540px){header{align-items:flex-start}.brand{font-size:1.7rem}.file-button{max-width:150px;text-align:center;padding:.5rem}.toolbar{align-items:stretch}.toolbar button{flex:1}.toolbar label{flex-basis:100%}.entry{grid-template-columns:1.5rem 1fr;gap:.65rem}.poster{width:55px}#welcome{padding:2rem 0 3rem}}
