:root{--bg:#fff;--fg:#1b1f24;--muted:#5d6670;--line:#dde1e6;--soft:#f5f7f9;--accent:#1d5fbf;--ok:#1a7f37;--warn:#9a6700;--bad:#b42318;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;--sans:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.45 var(--sans)}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
header.top{display:flex;flex-wrap:wrap;gap:4px 18px;align-items:center;padding:10px 16px;border-bottom:1px solid var(--line);background:var(--soft)}
header.top .brand{font-weight:700;color:var(--fg);margin-right:8px}
header.top nav{display:flex;flex-wrap:wrap;gap:4px 14px;flex:1}
header.top nav a.on{color:var(--fg);font-weight:600}
header.top form{margin:0}
main{max-width:1200px;margin:0 auto;padding:16px}
h1{font-size:1.35rem;margin:.2rem 0 1rem}h2{font-size:1.05rem;margin:1.6rem 0 .6rem;border-bottom:1px solid var(--line);padding-bottom:4px}
.mono,code,.id,.hash{font-family:var(--mono);font-size:.86em;word-break:break-all}
.muted{color:var(--muted)}.small{font-size:.85em}
.ok{color:var(--ok)}.warn{color:var(--warn)}.bad{color:var(--bad)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.card{border:1px solid var(--line);border-radius:6px;padding:10px 12px;background:#fff}
.card .n{font-size:1.6rem;font-weight:650}.card .l{color:var(--muted);font-size:.85em}
.tbl{width:100%;border-collapse:collapse;font-size:.92em}
.tbl th,.tbl td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl th{background:var(--soft);font-weight:600;white-space:nowrap}
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.badge{display:inline-block;padding:1px 7px;border-radius:10px;font-size:.78em;border:1px solid var(--line);background:var(--soft);white-space:nowrap}
.badge.ok{border-color:#b7dfc1;background:#eefaf1}.badge.bad{border-color:#f3c0bb;background:#fdf1f0}.badge.warn{border-color:#ecd9a6;background:#fff8e6}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.thumbs a{display:block;border:1px solid var(--line);border-radius:6px;overflow:hidden;color:var(--fg)}
.thumbs img{display:block;width:100%;aspect-ratio:1;object-fit:contain;object-position:top;background:#fff;border-bottom:1px solid var(--line)}
.thumbs .cap{padding:6px 8px;font-size:.8em}
.row-thumb{width:84px;height:84px;object-fit:contain;object-position:top;background:#fff;border:1px solid var(--line);border-radius:4px;background:var(--soft)}
.post-layout{display:grid;grid-template-columns:minmax(0,520px) minmax(0,1fr);gap:24px}
@media (max-width:860px){.post-layout{grid-template-columns:1fr}}
.shot img{max-width:100%;border:1px solid var(--line);border-radius:6px}
dl.meta{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;margin:0}
dl.meta dt{color:var(--muted)}dl.meta dd{margin:0}
.text{white-space:pre-wrap;background:var(--soft);border:1px solid var(--line);border-radius:6px;padding:10px 12px}
.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0 12px}
.filters a{padding:3px 10px;border:1px solid var(--line);border-radius:14px}.filters a.on{background:var(--fg);color:#fff;border-color:var(--fg)}
button,.btn,input[type=submit]{font:inherit;padding:5px 12px;border:1px solid #9aa4ae;border-radius:5px;background:#fff;color:var(--fg);cursor:pointer}
button.primary{background:var(--accent);border-color:var(--accent);color:#fff}
button.danger{color:var(--bad);border-color:#e3a19b}
input[type=text],input[type=password],input[type=number],input[type=date],select,textarea{font:inherit;padding:5px 8px;border:1px solid #9aa4ae;border-radius:5px;background:#fff;max-width:100%}
form.inline{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.notice{padding:8px 12px;border-radius:6px;background:#eef4fd;border:1px solid #c5d8f5;margin:10px 0}
.notice.warn{background:#fff8e6;border-color:#ecd9a6}.notice.bad{background:#fdf1f0;border-color:#f3c0bb}
.login{max-width:340px;margin:12vh auto;padding:0 16px}
.login input{width:100%;margin:6px 0 12px}
details summary{cursor:pointer;color:var(--accent)}
.htmx-request{opacity:.6}
.pager{margin:12px 0}