:root[data-theme="dark"] {
  --canvas:#0d1117; --subtle:#161b22; --inset:#010409;
  --border:#30363d; --border-soft:#21262d;
  --fg:#e6edf3; --muted:#9198a1; --faint:#7b848f; --warn:#d29922;
  --accent:#4493f8; --chip:#1f6feb26; --mark-bg:#bb800940; --mark-fg:#f2cc60;
  --skeleton:#1c2331;
}
:root[data-theme="light"] {
  --canvas:#ffffff; --subtle:#f6f8fa; --inset:#f6f8fa;
  --border:#d1d9e0; --border-soft:#d8dee4;
  --fg:#1f2328; --muted:#59636e; --faint:#68717f; --warn:#956c18;
  --accent:#0969da; --chip:#ddf4ff; --mark-bg:#fff8c5; --mark-fg:#4d2d00;
  --skeleton:#eaeef2;
}
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scrollbar-gutter:stable; }
body {
  margin:0; background:var(--canvas); color:var(--fg);
  font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
:root {
  --wrap:1060px; --rail-w:236px; --rail-gap:40px; --pad-x:28px; --radius:6px;
  --bleed:20px; --col-pad:24px;
  --head-h:92px;
  --shell:calc(var(--wrap) + var(--rail-w) + var(--rail-gap));
}
:root[data-width="narrow"] { --wrap:820px; }
:root[data-width="wide"] { --wrap:1340px; }
.wrap { width:100%; max-width:var(--shell); margin:0 auto; padding:0 var(--pad-x); }
[id] { scroll-margin-top:calc(var(--head-h) + 16px); }
a { color:var(--accent); text-decoration:none; }
a:hover { text-decoration:underline; }

.top, .chat-head {
  position:sticky; top:0; z-index:5; padding:16px 0 14px;
  background:var(--canvas); border-bottom:1px solid var(--border); 
}
h1 { margin:0 0 4px; font-size:24px; line-height:1.3; font-weight:600;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sub, .stat { color:var(--muted); font-size:13px; }
.sub { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:4px; }
.back { color:var(--muted); }
button {
  padding:4px 11px; font:inherit; font-size:12px; cursor:pointer;
  background:var(--subtle); color:var(--muted);
  border:1px solid var(--border); border-radius:var(--radius);
}
button:hover { color:var(--fg); border-color:var(--faint); }

.seg { display:inline-flex; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; background:var(--subtle); }
.seg button { border:0; border-radius:0; background:none; padding:4px 11px; }
.seg button + button { border-left:1px solid var(--border); }
.seg button.on { background:var(--chip); color:var(--fg); }
.seg button:hover { color:var(--fg); }

button.icon { display:inline-flex; align-items:center; justify-content:center; width:32px; padding:0; }
button.icon .ic { display:none; }
:root[data-theme="dark"] button.icon .sun { display:block; }
:root[data-theme="light"] button.icon .moon { display:block; }

* { scrollbar-width:thin; scrollbar-color:var(--border) transparent; }
::-webkit-scrollbar { width:10px; height:10px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:var(--border); border-radius:8px; border:2px solid var(--canvas); }
::-webkit-scrollbar-thumb:hover { background:var(--faint); }
.head-row { display:flex; align-items:center; gap:12px; }
.head-row h1 { flex:1; min-width:0; }
.actions { display:flex; gap:8px; flex-shrink:0; align-items:stretch; }
#q {
  width:100%; padding:8px 12px; border-radius:var(--radius);
  border:1px solid var(--border); background:var(--canvas); color:var(--fg); font:inherit;
}
#q:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--chip); }

main { padding-bottom:80px; }
h2 { margin:32px 0 2px; font-size:20px; font-weight:600; }
h3 { margin:20px 0 2px; font-size:12px; color:var(--faint); font-weight:600;
     text-transform:uppercase; letter-spacing:.05em; }
#months > section.year:first-child > h2 { margin-top:0; }
.month { content-visibility:auto; }
#list ul { list-style:none; margin:0; padding:0; }
#list li { padding:8px 0; border-bottom:1px solid var(--border-soft); display:flex; gap:12px; align-items:baseline; }
#list li a { flex:1; overflow-wrap:anywhere; }
.vols { display:grid; grid-template-columns:41px 41px; gap:14px; margin-left:auto; margin-right:16px; }
.vols .pics { grid-column:1; }
.vols .msgs { grid-column:2; }
.vol { display:grid; grid-template-columns:13px 24px; gap:4px; align-items:center;
  color:var(--faint); font-size:12px; font-variant-numeric:tabular-nums; }
.vol .n { text-align:left; }
.vol svg { opacity:.8; }
.hit .vols { display:inline-grid; margin-left:16px; margin-right:0; vertical-align:middle; }
.hit .date { margin-left:16px; }
.date { color:var(--muted); font-size:12px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.cnt { color:var(--faint); font-weight:400; }
.badge { background:var(--chip); color:var(--accent); border-radius:12px; padding:1px 9px; font-size:11px; white-space:nowrap; }

.chat-layout {
  display:grid; grid-template-columns:minmax(0,1fr) var(--rail-w); gap:var(--rail-gap);
  align-items:start; width:100%; max-width:var(--shell); margin:0 auto; padding:0 var(--pad-x);
}
.chat-layout > main { max-width:none; margin:0; padding:var(--col-pad) 0 80px; }
.search { position:sticky; top:var(--head-h); z-index:4; background:var(--canvas);
  margin-top:calc(var(--col-pad) * -1); padding:var(--col-pad) 0 12px; }

.rail { position:sticky; top:var(--head-h); max-height:calc(100vh - var(--head-h));
  overflow:auto; padding:24px 0 20px; }
.rail-head { font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--faint); margin-bottom:10px; padding-left:11px; }
.rail-year { font-size:13px; font-weight:600; color:var(--fg); margin:14px 0 4px; padding-left:11px; }
.rail-head + .rail-year { margin-top:0; }
.rail a {
  display:flex; gap:8px; justify-content:space-between; padding:6px 10px; margin-bottom:1px;
  border-radius:0 var(--radius) var(--radius) 0;
  border-left:2px solid transparent; color:var(--faint); font-size:12.5px; line-height:1.45;
}
.rail a:hover { color:var(--fg); background:var(--subtle); text-decoration:none; }
.rail a.on { color:var(--fg); background:var(--subtle); border-left-color:var(--accent); }
.rail .num { color:var(--faint); font-variant-numeric:tabular-nums; flex-shrink:0; }

.msg { margin:0 0 24px; }
.msg.user {
  background:var(--subtle);
  border-top:1px solid var(--border-soft); border-bottom:1px solid var(--border-soft);
  margin:0 calc(var(--bleed) * -1) 26px; padding:16px var(--bleed);
}
.msg.bot { margin:0 calc(var(--bleed) * -1) 26px; padding:0 var(--bleed) 26px;
  border-bottom:1px solid var(--border-soft); }
.who { font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--faint); margin-bottom:10px; }

.body { overflow-wrap:anywhere; }
.body > :first-child { margin-top:0; }
.body > :last-child { margin-bottom:0; }
.body p { margin:0 0 14px; }
.body h3, .body h4, .body h5 {
  margin:26px 0 12px; color:var(--fg); text-transform:none; letter-spacing:0; font-weight:600;
}
.body h3 { font-size:19px; padding-bottom:6px; border-bottom:1px solid var(--border-soft); }
.body h4 { font-size:16.5px; } .body h5 { font-size:15px; }
.body h6 { font-size:14px; color:var(--muted); margin:18px 0 8px; font-weight:600;
  text-transform:none; letter-spacing:0; }
.nolink { color:var(--muted); border-bottom:1px dotted var(--border); cursor:help; }
.body details { border:1px solid var(--border); border-radius:var(--radius); padding:8px 14px; margin:0 0 14px; }
.body details summary { cursor:pointer; color:var(--muted); font-size:14px; }
.body ul, .body ol { margin:0 0 14px; padding-left:26px; }
.body li { margin:4px 0; }
.body li > ul, .body li > ol { margin:4px 0; }
.body hr { border:0; border-top:1px solid var(--border); margin:22px 0; }
blockquote { border-left:3px solid var(--border); margin:0 0 14px; padding:0 16px; color:var(--muted); }
pre {
  background:var(--subtle); border:1px solid var(--border-soft); border-radius:var(--radius);
  padding:14px 16px; overflow:auto; margin:0 0 14px; line-height:1.45;
}
code { font-family:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace; font-size:13px; }
p code, li code, td code, h3 code, h4 code { background:var(--chip); padding:2px 6px; border-radius:var(--radius); font-size:12.5px; }
img {
  max-width:100%; width:var(--iw, auto); height:auto; display:block;
  margin:10px 0; border:1px solid var(--border); border-radius:var(--radius); cursor:zoom-in;
  background:var(--skeleton);
}
img.ready { background:none; }
table { border-collapse:collapse; margin:0 0 14px; width:100%; font-size:14px; display:block; overflow-x:auto; }
th, td { border:1px solid var(--border); padding:6px 13px; text-align:left; vertical-align:top; }
th { background:var(--subtle); font-weight:600; }

.math-block { display:block; margin:16px 0; overflow-x:auto; }
.katex { font-size:1.02em; }
.katex-display { margin:0; }

details.svc { margin:0 calc(var(--bleed) * -1) 20px; border-left:2px solid var(--border);
  padding:2px 0 2px 18px; }
details.svc > summary { cursor:pointer; color:var(--faint); font-size:13px; list-style:none; padding:2px 0; }
details.svc > summary::-webkit-details-marker { display:none; }
details.svc > summary::before { content:"▸"; margin-right:6px; }
details.svc[open] > summary::before { content:"▾"; margin-right:6px; }
details.svc > summary:hover { color:var(--muted); }
.svc-body { margin-top:10px; }
.svc-item { margin:0 0 14px; overflow-wrap:anywhere; }
.svc-item p { margin:0 0 14px; }
.svc-item ul, .svc-item ol { margin:0 0 14px; padding-left:26px; }
.svc-item h3, .svc-item h4, .svc-item h5, .svc-item h6 {
  font-size:14px; color:var(--muted); font-weight:600; margin:14px 0 8px;
  text-transform:none; letter-spacing:0; border:0; padding:0;
}
.svc-who { font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--faint); margin-bottom:6px; }
.svc-item pre { font-size:12px; max-height:400px; }
.svc-item img { width:auto; max-height:240px; }
.recap { color:var(--faint); font-size:13px; font-style:italic; }
.think-item { margin:0 0 12px; font-size:14.5px; color:var(--muted); }
.think-item b { color:var(--fg); display:block; margin-bottom:4px; font-weight:600; }
.attach { margin-top:12px; font-size:13px; color:var(--muted); }
.miss { color:var(--warn); font-size:13px; }
.warn { color:var(--warn); }

.lb {
  position:fixed; inset:0; z-index:50; background:rgba(1,4,9,.92);
  display:flex; align-items:center; justify-content:center; padding:64px 24px 24px;
}
.lb[hidden] { display:none; }
.lb-img { width:auto; max-width:100%; max-height:100%; border-radius:var(--radius);
  border:1px solid var(--border); cursor:default; margin:0; }
.lb-bar {
  position:absolute; top:0; left:0; right:0; height:52px; display:flex; align-items:center;
  gap:10px; padding:0 18px; background:rgba(1,4,9,.7); backdrop-filter:blur(6px);
}
.lb-count { color:#9198a1; font-size:13px; font-variant-numeric:tabular-nums; }
.lb-bar .sp { flex:1; }
.lb-nav {
  position:absolute; top:50%; transform:translateY(-50%); width:44px; height:64px;
  font-size:26px; line-height:1; padding:0; background:rgba(22,27,34,.8); color:#e6edf3;
}
.lb-prev { left:14px; } .lb-next { right:14px; }
.hit { padding:10px 0; border-bottom:1px solid var(--border-soft); }
.ctx { color:var(--muted); font-size:13px; margin-top:4px; }
mark { background:var(--mark-bg); color:var(--mark-fg); border-radius:3px; padding:0 2px; }

@media (max-width:1095px) {
  :root[data-width="narrow"] .chat-layout { display:block; max-width:var(--wrap); }
  :root[data-width="narrow"] .wrap { max-width:var(--wrap); }
  :root[data-width="narrow"] .rail { display:none; }
}
@media (max-width:1335px) {
  :root[data-width="normal"] .chat-layout, :root:not([data-width]) .chat-layout {
    display:block; max-width:var(--wrap); }
  :root[data-width="normal"] .wrap, :root:not([data-width]) .wrap { max-width:var(--wrap); }
  :root[data-width="normal"] .rail, :root:not([data-width]) .rail { display:none; }
}
@media (max-width:1615px) {
  :root[data-width="wide"] .chat-layout { display:block; max-width:var(--wrap); }
  :root[data-width="wide"] .wrap { max-width:var(--wrap); }
  :root[data-width="wide"] .rail { display:none; }
}
@media (max-width:720px) {
  :root { --pad-x:16px; --bleed:16px; }
  h1 { font-size:20px; }
  #list li { flex-wrap:wrap; gap:4px; }
  img { width:auto; max-height:320px; }
}