:root{
  --bg:#fbfaf7; --fg:#23201c; --dim:#6b655c; --line:#e2ddd3;
  --accent:#8a4b2a; --card:#fff; --code:#f3f0ea;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#171614; --fg:#e6e2da; --dim:#9b948a; --line:#2e2c28;
    --accent:#d59a6f; --card:#1e1d1a; --code:#232120;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--fg);
  font:16px/1.6 Georgia,"Times New Roman",serif;
}
.wrap{max-width:52rem;margin:0 auto;padding:2rem 1.1rem 4rem}
a{color:var(--accent)}
a:hover{text-decoration:none}
header{border-bottom:1px solid var(--line);padding-bottom:1rem;margin-bottom:1.6rem}
header h1{margin:0;font-size:1.7rem;letter-spacing:.01em}
header h1 a{color:inherit;text-decoration:none}
header p.tag{margin:.35rem 0 .9rem;color:var(--dim);font-style:italic}
nav a{margin-right:1.1rem;font-size:.95rem}
h2{margin:2.2rem 0 .7rem;font-size:1.25rem;border-bottom:1px solid var(--line);padding-bottom:.3rem}
h3{margin:1.6rem 0 .4rem;font-size:1.05rem}
p{margin:.8rem 0}
.dim{color:var(--dim)}
small{color:var(--dim)}
code,.mono{font-family:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;font-size:.88em}
code{background:var(--code);padding:.1em .35em;border-radius:3px}

/* каталог */
.tools{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center;margin:.9rem 0}
.tools input{
  font:inherit;font-size:.95rem;padding:.4rem .6rem;background:var(--card);
  color:var(--fg);border:1px solid var(--line);border-radius:4px;min-width:14rem;flex:1
}
.tools .count{color:var(--dim);font-size:.9rem;white-space:nowrap}
.scroll{overflow-x:auto;border:1px solid var(--line);border-radius:5px;background:var(--card)}
table{border-collapse:collapse;width:100%;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:.9rem}
th,td{text-align:left;padding:.45rem .6rem;border-bottom:1px solid var(--line);vertical-align:top}
th{background:var(--code);font-weight:600;white-space:nowrap;position:sticky;top:0}
tr:last-child td{border-bottom:0}
td.num,td.yr{white-space:nowrap;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.85rem;color:var(--dim)}
td.st{white-space:nowrap;font-size:.85rem}
.notes-list{list-style:none;padding:0}
.notes-list li{margin:.7rem 0}
.notes-list time{display:block;color:var(--dim);font-size:.85rem}
.want{list-style:none;padding:0}
.want li{padding:.35rem 0;border-bottom:1px dotted var(--line)}
footer{margin-top:3rem;padding-top:1rem;border-top:1px solid var(--line);color:var(--dim);font-size:.9rem}
blockquote{margin:1rem 0;padding:.2rem 0 .2rem 1rem;border-left:3px solid var(--line);color:var(--dim)}

/* на широком экране таблице тесно в колонке текста — даём ей выйти за поля */
@media (min-width:62rem){
  .scroll{margin-left:-4.5rem;margin-right:-4.5rem}
}