/* ---------- fonts: PT Serif (Cyrillic + Latin subsets) ---------- */
@font-face{font-family:'PT Serif';font-style:normal;font-weight:400;font-display:swap;src:url(/static/vendor/fonts/pt-serif-cyrillic-400-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'PT Serif';font-style:normal;font-weight:400;font-display:swap;src:url(/static/vendor/fonts/pt-serif-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'PT Serif';font-style:italic;font-weight:400;font-display:swap;src:url(/static/vendor/fonts/pt-serif-cyrillic-400-italic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'PT Serif';font-style:italic;font-weight:400;font-display:swap;src:url(/static/vendor/fonts/pt-serif-latin-400-italic.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'PT Serif';font-style:normal;font-weight:700;font-display:swap;src:url(/static/vendor/fonts/pt-serif-cyrillic-700-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'PT Serif';font-style:normal;font-weight:700;font-display:swap;src:url(/static/vendor/fonts/pt-serif-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'PT Serif';font-style:italic;font-weight:700;font-display:swap;src:url(/static/vendor/fonts/pt-serif-cyrillic-700-italic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'PT Serif';font-style:italic;font-weight:700;font-display:swap;src:url(/static/vendor/fonts/pt-serif-latin-700-italic.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  color-scheme: light;
  --bg:#ebe9e3; --paper:#fffefa; --ink:#1a1a1a; --ink-soft:#3a3a3a; --muted:#6b6b6b; --line:#d8d4cb; --rule:#2b2b2b; --ui:#f7f6f2; --accent:#2a5aa8;
  --c-comment:#ffe483; --c-correction:#ffc7c7; --c-question:#c9dcff; --c-chat:#e3d3ff;
  --c-comment-strong:#b98700; --c-correction-strong:#c0392b; --c-question-strong:#2a5aa8; --c-chat-strong:#6b3fb3;
  --ins:#1a7f37; --ins-bg:#e2f4e7;
  --warn-bg:#fff4d6; --warn-ink:#5a4300; --warn-line:#f0d58a;
  --topbar-h:52px;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --serif: "PT Serif", Georgia, "Times New Roman", "Noto Serif", serif;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
*{ box-sizing:border-box }
[hidden]{ display:none !important }
html,body{ margin:0 }
body{ background:var(--bg); color:var(--ink); font-family:var(--sans); -webkit-font-smoothing:antialiased }
button{ font:inherit }

/* ---------- top bar ---------- */
.topbar{ position:sticky; top:0; z-index:50; min-height:var(--topbar-h); display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:6px 16px; background:var(--ui); border-bottom:1px solid var(--line); font-size:13px; }
.topbar .brand{ font-weight:650; letter-spacing:.01em; margin-right:6px; white-space:nowrap }
.topbar .brand small{ font-weight:400; color:var(--muted); margin-left:6px }
.topbar .spacer{ flex:1 }
.btn{ border:1px solid var(--line); background:var(--paper); color:var(--ink); border-radius:6px; padding:5px 10px; cursor:pointer; white-space:nowrap; text-decoration:none; display:inline-block; line-height:1.3 }
.btn:hover{ border-color:var(--muted) }
.btn.primary{ background:var(--accent); color:#fff; border-color:var(--accent) }
.btn.primary:hover{ filter:brightness(1.08) }
.btn.sm{ padding:3px 8px; font-size:12px }
.btn[disabled]{ opacity:.5; cursor:default }
.switch{ display:inline-flex; align-items:center; gap:6px; cursor:pointer; user-select:none; padding:4px 8px; border-radius:6px; border:1px solid transparent }
.switch:hover{ background:var(--paper) }
.switch input{ accent-color:var(--accent) }
.switch.sm{ font-size:11.5px; color:var(--muted); padding:2px 6px; gap:4px }
#saveStatus{ color:var(--muted); font-size:12px; white-space:nowrap; margin-right:4px }
.view-toggles{ display:inline-flex; gap:2px; margin-left:4px; padding-left:8px; border-left:1px solid var(--line) }
body:not(.review) .view-toggles{ display:none }
.btn.round{ border-radius:999px; width:30px; padding:5px 0; text-align:center; font-weight:700 }
.btn.user{ display:inline-flex; align-items:center; gap:7px; padding:3px 10px 3px 4px }
.avatar{ width:22px; height:22px; border-radius:50%; background:var(--c-chat); color:var(--c-chat-strong); font-size:10.5px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; letter-spacing:.02em }
.caret{ font-size:10px; color:var(--muted); margin-left:2px }
/* dropdown menus */
.menu{ position:relative }
.menu > summary{ list-style:none; cursor:pointer; user-select:none }
.menu > summary::-webkit-details-marker{ display:none }
.menu[open] > summary{ border-color:var(--muted); background:var(--ui) }
.menu-body{ position:absolute; right:0; top:calc(100% + 6px); min-width:250px; background:var(--paper); border:1px solid var(--line); border-radius:10px; box-shadow:0 14px 40px rgba(20,15,5,.16); padding:6px; z-index:70; font-size:13px; text-align:left }
.menu-body a, .menu-body button{ display:block; width:100%; text-align:left; padding:7px 10px; border:0; background:none; border-radius:6px; color:var(--ink); text-decoration:none; cursor:pointer; font:inherit; line-height:1.35 }
.menu-body a:hover, .menu-body button:hover{ background:var(--ui) }
.menu-body small{ display:block; color:var(--muted); font-size:11px; margin-top:1px }
.menu-body hr{ border:0; border-top:1px solid var(--line); margin:4px 2px }
.menu-body.help{ width:min(460px, 92vw); padding:12px 16px 14px; line-height:1.5; color:var(--ink-soft) }
.menu-body.help h4{ margin:10px 0 3px; font-size:11px; text-transform:uppercase; letter-spacing:.07em; color:var(--muted) }
.menu-body.help h4:first-child{ margin-top:0 }
.menu-body.help p{ margin:0 0 4px }
.menu-body.help b{ color:var(--ink) }
.menu-body.help kbd{ font:11px var(--sans); border:1px solid var(--line); border-radius:3px; padding:0 4px; background:var(--ui); color:var(--ink) }
.menu-body.help table.keys{ border-collapse:collapse; margin-top:2px }
.menu-body.help table.keys td{ padding:2px 10px 2px 0; vertical-align:top; font-size:12.5px }
.loc-demo{ font:600 11px/1.4 var(--sans); color:var(--c-chat-strong); background:var(--c-chat); border-radius:4px; padding:0 5px; white-space:nowrap }
#saveStatus.dirty{ color:#b45309; font-weight:600 }
#saveStatus.error{ color:var(--c-correction-strong); font-weight:600 }

#banner{ background:var(--warn-bg); color:var(--warn-ink); border-bottom:1px solid var(--warn-line); padding:8px 16px; font-size:13px; display:flex; gap:10px; align-items:center; flex-wrap:wrap }
#banner[hidden]{ display:none }
#banner .btn{ padding:3px 9px; font-size:12px }

/* ---------- layout ---------- */
.layout{ display:grid; grid-template-columns:minmax(0,1fr) 380px; align-items:start }
.layout.chat-open{ grid-template-columns:minmax(0,1fr) 330px 480px }
body:not(.review) .layout{ grid-template-columns:minmax(0,1fr) }
body:not(.review) #sidebar, body:not(.review) #chat{ display:none !important }
#sidebar,#chat{ position:sticky; top:var(--topbar-h); height:calc(100vh - var(--topbar-h)); overflow:auto; background:var(--ui); border-left:1px solid var(--line); font-size:13px }
#chat[hidden]{ display:none }
#chat{ display:flex; flex-direction:column; overflow:hidden }
@media (max-width:1380px){
  .layout.chat-open{ grid-template-columns:minmax(0,1fr) 480px }
  .layout.chat-open #sidebar{ display:none }
}
@media (max-width:980px){
  .layout, .layout.chat-open{ grid-template-columns:1fr }
  #sidebar{ position:static; height:auto; max-height:none; border-left:0; border-top:1px solid var(--line) }
  #chat{ position:fixed; inset:var(--topbar-h) 0 0 0; height:auto; z-index:40; border-left:0 }
  #paper{ margin:12px; padding:32px 22px 40px }
}

/* ---------- paper: Russian academic typography ---------- */
#paper{
  font-family:var(--serif); font-size:18px; line-height:1.58; color:var(--ink);
  background:var(--paper); max-width:800px; margin:32px auto; padding:64px 72px 84px;
  box-shadow:0 1px 2px rgba(0,0,0,.06), 0 12px 36px rgba(40,30,10,.08); border-radius:3px;
  text-align:left; hyphens:auto; -webkit-hyphens:auto; hyphenate-limit-chars:7 3 3; -webkit-hyphenate-limit-before:3; -webkit-hyphenate-limit-after:3;
  font-kerning:normal; font-feature-settings:"kern","liga"; text-rendering:optimizeLegibility; overflow-wrap:break-word;
}
#paper p,#paper figcaption,#paper .refs li{ text-align:justify; text-align-last:left }
body.nohyph #paper p,body.nohyph #paper figcaption,body.nohyph #paper .refs li{ text-align:left }
#paper h1{ font-size:1.55em; line-height:1.28; margin:0 0 .75em; font-weight:700; text-align:center; hyphens:manual; letter-spacing:-.005em }
#paper p.authors{ font-size:1em; margin:0 0 .25em; text-align:center; text-align-last:center; text-indent:0; letter-spacing:.01em }
#paper p.affil{ font-size:.9em; font-style:italic; color:var(--ink-soft); margin:0 0 2em; text-align:center; text-align-last:center; text-indent:0 }
#paper h2{ font-size:1.22em; line-height:1.3; margin:1.7em 0 .55em; font-weight:700; hyphens:manual }
#paper h2.abstract{ font-size:1.05em; margin-top:1.2em }
#paper h3{ font-size:1.04em; line-height:1.35; margin:1.35em 0 .45em; font-weight:700; font-style:italic; hyphens:manual }
#paper p{ margin:0 0 .3em; text-indent:1.7em }
#paper p.cont,#paper p.noindent{ text-indent:0 }
#paper .lead{ font-weight:700 }
#paper p.kw{ margin-top:.8em; text-indent:0 }
#paper .kw .lead{ font-weight:400; font-style:italic }
#paper a{ color:var(--accent); text-decoration:none; border-bottom:1px solid rgba(42,90,168,.25); overflow-wrap:anywhere }
#paper a:hover{ border-bottom-color:currentColor }
#paper sub,#paper sup{ line-height:0 }
#paper code{ font-family:var(--mono); font-size:.86em; background:var(--ui); padding:.05em .3em; border-radius:3px }
.editor-note{ font-family:var(--sans); font-size:12px; color:var(--muted); border:1px dashed var(--line); padding:6px 10px; border-radius:6px; display:inline-block; text-align:left; text-indent:0 }

/* equations */
.eq{ position:relative; display:flex; align-items:center; margin:.45em 0 .7em; padding:0 3em 0 0 }
.eq .m{ flex:1; min-width:0; text-align:center }
.eq .num{ position:absolute; right:0; top:50%; transform:translateY(-50%) }
.eq.wide .m-out{ font-size:.86em }
mjx-container[display="true"]{ margin:0 !important; overflow-x:auto; overflow-y:hidden; padding:2px 0 }

/* math: the verbatim draft text stays in the document for annotation; MathJax output is shown in its place */
.m{ position:relative; white-space:nowrap }
.m-out{ display:none }
body.mj .m-out{ display:inline }
body.mj .eq .m-out{ display:block }
body.mj .m-src{ position:absolute; left:0; top:0; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap }
body.mj .m:has(mark.ann) > .m-out{ background:var(--c-comment); border-radius:3px; box-shadow:0 0 0 2px var(--c-comment) }
body.mj .m:has(mark.ann.t-correction) > .m-out{ background:var(--c-correction); box-shadow:0 0 0 2px var(--c-correction) }
body.mj .m:has(mark.ann.t-question) > .m-out{ background:var(--c-question); box-shadow:0 0 0 2px var(--c-question) }
body.mj .m:has(mark.ann.t-chat) > .m-out{ background:var(--c-chat); box-shadow:0 0 0 2px var(--c-chat) }
body.mj .m:has(mark.ann.resolved) > .m-out{ background:transparent; box-shadow:none; border-bottom:2px dotted var(--muted) }
body.mj .m:has(mark.ann.active) > .m-out{ outline:2px solid var(--accent); outline-offset:2px }

/* tables (rules only, in the manner of booktabs) */
table.tbl{ border-collapse:collapse; margin:.9em auto 1.5em; font-size:.86em; line-height:1.35; min-width:72%; border-top:1.4px solid var(--rule); border-bottom:1.4px solid var(--rule) }
.tbl caption{ caption-side:top; text-align:left; font-size:.95em; margin:0 0 .55em; padding:0; hyphens:manual }
.tbl th{ font-weight:700; padding:.3em .8em .35em; border-bottom:.8px solid var(--rule); text-align:left; vertical-align:bottom }
.tbl td{ padding:.18em .8em; border:0; text-align:left; vertical-align:top }
.tbl tbody tr:first-child td{ padding-top:.45em }
.tbl tbody tr:last-child td{ padding-bottom:.45em }
.tbl td.n,.tbl th.n{ text-align:center; font-variant-numeric:tabular-nums }
.tbl tbody tr:hover td{ background:rgba(0,0,0,.025) }

/* figures */
figure{ margin:1.1em 0 1.4em; text-align:center }
figure img{ max-width:100%; height:auto; background:#fff }
figure.narrow img{ max-width:88% }
figcaption{ font-size:.86em; line-height:1.45; color:var(--ink-soft); margin:.6em auto 0; hyphens:manual; max-width:95% }

/* references & code links */
.refs{ font-size:.9em; line-height:1.5; padding-left:1.8em; margin:.3em 0 0 }
.refs li{ margin-bottom:.35em; padding-left:.2em }
#paper .code-links p{ margin:0 0 .25em; text-indent:0; text-align:left }

/* ---------- annotations in text ---------- */
mark.ann{ background:var(--c-comment); color:inherit; padding:.08em 0; border-radius:2px; cursor:pointer; box-decoration-break:clone; -webkit-box-decoration-break:clone; transition:background .15s }
mark.ann.t-correction{ background:var(--c-correction); text-decoration:line-through; text-decoration-color:var(--c-correction-strong); text-decoration-thickness:1.5px }
mark.ann.t-question{ background:var(--c-question) }
mark.ann.t-chat{ background:var(--c-chat) }
mark.ann.resolved{ background:transparent; text-decoration:none; border-bottom:2px dotted var(--muted) }
mark.ann.active{ outline:2px solid var(--accent); outline-offset:1px }
@keyframes flash{ 0%{ box-shadow:0 0 0 6px var(--accent) } 100%{ box-shadow:0 0 0 0 transparent } }
mark.ann.flash{ animation:flash .9s ease-out }
.ann-ins{ text-decoration:none; color:var(--ins); background:var(--ins-bg); border-radius:2px; padding:0 .18em; margin-left:.15em }
.ann-ins:empty::before{ content:"∅"; opacity:.7 }
.ann-ins.resolved{ display:none }
.ann-badge{ font:650 10px/1 var(--sans); color:#fff; background:var(--c-comment-strong); border-radius:999px; padding:2px 5px; margin-left:3px; vertical-align:super; cursor:pointer; user-select:none; -webkit-user-select:none; white-space:nowrap; text-decoration:none }
.ann-badge.t-correction{ background:var(--c-correction-strong) }
.ann-badge.t-question{ background:var(--c-question-strong) }
.ann-badge.t-chat{ background:var(--c-chat-strong) }
.ann-badge.resolved{ opacity:.45 }
body:not(.show-corr) .ann-ins{ display:none }
body:not(.show-corr) mark.ann.t-correction{ text-decoration:none }
body:not(.show-badges) .ann-badge{ display:none }

/* ---------- selection popover ---------- */
#popover{ position:absolute; z-index:60; display:flex; gap:2px; padding:4px; background:#24262b; color:#fff; border-radius:9px; box-shadow:0 8px 28px rgba(0,0,0,.3); font-size:12px }
#popover[hidden]{ display:none }
#popover button{ background:transparent; color:#fff; border:0; padding:6px 9px; border-radius:6px; cursor:pointer; display:flex; align-items:center; gap:7px; white-space:nowrap }
#popover button:hover{ background:rgba(255,255,255,.14) }
#popover .sw,.ed .sw{ width:10px; height:10px; border-radius:2px; display:inline-block }
#popover kbd{ opacity:.55; font:11px var(--sans); border:1px solid rgba(255,255,255,.35); border-radius:3px; padding:0 4px }
.sw.t-comment{ background:var(--c-comment-strong) } .sw.t-correction{ background:var(--c-correction-strong) } .sw.t-question{ background:var(--c-question-strong) } .sw.t-chat{ background:var(--c-chat-strong) }

/* ---------- editor dialog ---------- */
dialog#editor{ border:1px solid var(--line); border-radius:12px; padding:0; width:min(600px,92vw); background:var(--paper); color:var(--ink); font-size:13px; box-shadow:0 20px 60px rgba(0,0,0,.3) }
dialog#editor::backdrop{ background:rgba(0,0,0,.28) }
.ed{ padding:16px 18px 14px; display:grid; gap:11px }
.ed h4{ margin:0; font-size:14px }
.ed label{ display:grid; gap:4px; font-weight:600; font-size:11.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em }
.ed input,.ed textarea,.ed select{ font:inherit; font-size:13.5px; padding:7px 9px; border:1px solid var(--line); border-radius:6px; background:var(--ui); color:var(--ink); width:100%; text-transform:none; letter-spacing:0; font-weight:400 }
.ed textarea{ min-height:96px; resize:vertical; line-height:1.4 }
.ed .quote{ font-family:var(--serif); font-size:14.5px; background:var(--ui); border-left:3px solid var(--line); padding:6px 10px; max-height:130px; overflow:auto; white-space:pre-wrap; text-transform:none; letter-spacing:0; font-weight:400; color:var(--ink) }
.ed .row{ display:flex; gap:8px; justify-content:flex-end; align-items:center }
.ed .row .hint{ margin-right:auto; color:var(--muted); font-size:11.5px }
.ed .types{ display:flex; gap:6px }
.ed .types button{ flex:1; border:1px solid var(--line); background:var(--ui); color:var(--ink); border-radius:6px; padding:7px 6px; cursor:pointer; font-size:12.5px; display:flex; align-items:center; justify-content:center; gap:6px; text-transform:none; letter-spacing:0; font-weight:500 }
.ed .types button.on{ border-color:var(--accent); box-shadow:0 0 0 1px var(--accent) inset }

/* ---------- sidebar ---------- */
.sb-section{ padding:12px 14px; border-bottom:1px solid var(--line) }
.sb-section h3{ margin:0 0 8px; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); font-weight:650; display:flex; align-items:center; gap:8px; flex-wrap:wrap }
.sb-section h3 .cnt{ color:var(--ink); background:var(--paper); border:1px solid var(--line); border-radius:999px; padding:1px 7px; font-size:10.5px; white-space:nowrap }
.sb-section h3 .btn{ text-transform:none; letter-spacing:0; font-weight:500 }
.sb-row{ display:flex; gap:8px; align-items:center; margin-bottom:8px }
.sb-row:last-child{ margin-bottom:0 }
#sidebar input[type=text],#sidebar input[type=search],#sidebar select,#sidebar textarea{ font:inherit; font-size:13px; padding:6px 8px; border:1px solid var(--line); border-radius:6px; background:var(--paper); color:var(--ink); width:100% }
#general{ min-height:76px; resize:vertical; line-height:1.4 }
.sb-toggles{ display:flex; flex-wrap:wrap; gap:4px 12px; font-size:12px; color:var(--muted) }
.sb-toggles label{ display:inline-flex; gap:5px; align-items:center; cursor:pointer }
.sb-toggles input{ accent-color:var(--accent) }
.filters{ display:flex; gap:6px; align-items:center }
.filters select{ width:auto !important }
#annList{ padding:4px 0 24px }
.card{ background:var(--paper); border:1px solid var(--line); border-left:4px solid var(--c-comment-strong); border-radius:8px; padding:10px 12px; margin:8px 12px; cursor:pointer }
.card:hover{ border-color:var(--muted); border-left-color:var(--c-comment-strong) }
.card.t-correction, .card.t-correction:hover{ border-left-color:var(--c-correction-strong) }
.card.t-question, .card.t-question:hover{ border-left-color:var(--c-question-strong) }
.card.t-chat, .card.t-chat:hover{ border-left-color:var(--c-chat-strong) }
.card.resolved{ opacity:.62; border-left-style:dotted }
.card.active{ box-shadow:0 0 0 2px var(--accent) }
.card.orphan{ border-style:dashed }
.card-head{ display:flex; align-items:center; gap:7px; font-size:11px; color:var(--muted); margin-bottom:6px; flex-wrap:wrap }
.card-head .num{ font-weight:700; color:var(--ink); font-size:12px }
.card-head .type{ font-weight:650; text-transform:uppercase; letter-spacing:.06em; font-size:10px }
.card.t-comment .type{ color:var(--c-comment-strong) } .card.t-correction .type{ color:var(--c-correction-strong) } .card.t-question .type{ color:var(--c-question-strong) } .card.t-chat .type{ color:var(--c-chat-strong) }
.card-head .sec{ background:var(--ui); border:1px solid var(--line); border-radius:4px; padding:0 5px }
.card-head .date{ margin-left:auto }
.card .quote{ font-family:var(--serif); font-size:13.5px; color:var(--ink); opacity:.85; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden }
.card .quote::before{ content:"“" } .card .quote::after{ content:"”" }
.card .repl{ margin-top:6px; font-family:var(--serif); font-size:13.5px }
.card .repl s{ color:var(--c-correction-strong) }
.card .repl ins{ color:var(--ins); text-decoration:none; background:var(--ins-bg); padding:0 .18em; border-radius:2px }
.card .text{ margin-top:6px; white-space:pre-wrap; font-size:13px; line-height:1.4 }
.card .chatmeta{ margin-top:6px; font-size:12px; color:var(--muted); display:flex; gap:8px; align-items:center }
.card .chatmeta .title{ color:var(--ink); font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:1; min-width:0 }
.card .chatmeta .busy{ color:var(--c-chat-strong); font-style:italic; animation:pulse 1.4s infinite; white-space:nowrap }
.card .warn{ margin-top:6px; color:#b45309; font-size:11.5px }
.card-actions{ display:flex; gap:4px; margin-top:8px }
.card-actions button{ font-size:11px; background:transparent; border:1px solid var(--line); border-radius:5px; padding:3px 7px; cursor:pointer; color:var(--ink) }
.card-actions button:hover{ border-color:var(--muted) }
.card-actions button.danger:hover{ color:var(--c-correction-strong); border-color:var(--c-correction-strong) }
.empty{ padding:28px 16px; color:var(--muted); text-align:center; line-height:1.5 }
.sb-help{ color:var(--muted); font-size:11.5px; line-height:1.45 }
.sb-help kbd,.chat-compose kbd{ font:11px var(--sans); border:1px solid var(--line); border-radius:3px; padding:0 4px; background:var(--paper) }

/* ---------- chat panel ---------- */
.chat-head{ display:flex; align-items:center; gap:8px; padding:8px 10px; border-bottom:1px solid var(--line); background:var(--paper) }
.chat-title{ flex:1; min-width:0; font-weight:600; font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.chat-anchor{ padding:8px 12px; border-bottom:1px solid var(--line); font-size:12px; color:var(--muted); display:flex; gap:8px; align-items:flex-start; cursor:pointer; background:var(--ui) }
.chat-anchor:hover{ background:var(--paper) }
.chat-anchor .sec{ background:var(--paper); border:1px solid var(--line); border-radius:4px; padding:0 5px; white-space:nowrap }
.chat-anchor q{ font-family:var(--serif); font-size:13px; color:var(--ink); display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; quotes:"“" "”" }
.chat-anchor.doc{ cursor:default }
.chat-log{ flex:1; overflow:auto; padding:12px 14px 4px; scroll-behavior:smooth }
.msg{ margin:0 0 14px; font-size:13.5px; line-height:1.5 }
.msg.user{ background:var(--paper); border:1px solid var(--line); border-radius:10px 10px 2px 10px; padding:8px 12px; margin-left:28px }
.msg.assistant{ padding:0 2px 0 10px; border-left:3px solid var(--c-chat) }
.msg.assistant .seg-text{ overflow-wrap:break-word }
.msg.assistant .seg-text > :first-child{ margin-top:0 }
.msg.assistant .seg-text > :last-child{ margin-bottom:0 }
.msg .seg-text p{ margin:0 0 .6em }
.msg .seg-text ul,.msg .seg-text ol{ margin:.2em 0 .6em; padding-left:1.4em }
.msg .seg-text li{ margin:.15em 0 }
.msg .seg-text h1,.msg .seg-text h2,.msg .seg-text h3,.msg .seg-text h4{ font-size:13.5px; margin:.8em 0 .3em; font-weight:700 }
.msg .seg-text code{ font-family:var(--mono); font-size:12px; background:var(--paper); border:1px solid var(--line); border-radius:3px; padding:0 .3em }
.msg .seg-text pre{ background:var(--paper); border:1px solid var(--line); border-radius:6px; padding:8px 10px; overflow:auto; font-size:12px; line-height:1.4 }
.msg .seg-text pre code{ border:0; padding:0; background:transparent }
.msg .seg-text blockquote{ margin:.4em 0; padding:2px 10px; border-left:3px solid var(--line); color:var(--ink-soft) }
.msg .seg-text table{ border-collapse:collapse; font-size:12.5px; margin:.4em 0 .7em; max-width:100%; display:block; overflow:auto }
.msg .seg-text th,.msg .seg-text td{ border:1px solid var(--line); padding:2px 7px; text-align:left; vertical-align:top }
.msg .seg-text th{ background:var(--paper) }
.msg .seg-text a{ color:var(--accent) }
.msg .seg-text mjx-container{ font-size:100% }
.msg .seg-text mjx-container[display="true"]{ margin:.4em 0 !important }
.seg-tool{ font-size:12px; margin:4px 0 8px; color:var(--muted) }
.seg-tool summary{ cursor:pointer; list-style:none; display:flex; gap:6px; align-items:baseline }
.seg-tool summary::-webkit-details-marker{ display:none }
.seg-tool summary::before{ content:"▸"; font-size:10px; color:var(--muted) }
.seg-tool[open] summary::before{ content:"▾" }
.seg-tool code{ font-family:var(--mono); font-size:11.5px; color:var(--ink-soft) }
.seg-tool pre{ margin:4px 0 0; font-family:var(--mono); font-size:11px; white-space:pre-wrap; max-height:260px; overflow:auto; background:var(--paper); border:1px solid var(--line); border-radius:6px; padding:6px 8px; color:var(--ink) }
.msg .status{ color:var(--muted); font-size:12px; font-style:italic }
.msg .status.pulse::after{ content:"…"; animation:pulse 1.2s infinite }
@keyframes pulse{ 0%{ opacity:.2 } 50%{ opacity:1 } 100%{ opacity:.2 } }
.msg .foot{ color:var(--muted); font-size:10.5px; margin-top:4px; display:flex; gap:10px; flex-wrap:wrap }
.msg .foot .warn{ color:#b45309 }
.msg.err{ color:var(--c-correction-strong); font-size:12.5px; padding:6px 10px; border:1px dashed var(--c-correction-strong); border-radius:8px; white-space:pre-wrap }
.chat-compose{ border-top:1px solid var(--line); padding:8px 12px 10px; background:var(--paper) }
.chips{ display:flex; flex-wrap:wrap; gap:4px; margin-bottom:6px }
.chips button{ font-size:11px; background:var(--ui); border:1px solid var(--line); border-radius:999px; padding:2px 9px; cursor:pointer; color:var(--ink-soft) }
.chips button:hover{ border-color:var(--muted); color:var(--ink) }
#chatInput{ font:inherit; font-size:13.5px; width:100%; padding:7px 9px; border:1px solid var(--line); border-radius:8px; background:var(--ui); color:var(--ink); resize:vertical; min-height:60px; line-height:1.4 }
.chat-compose .row{ display:flex; align-items:center; gap:8px; margin-top:6px }
.chat-compose .web{ display:inline-flex; gap:5px; align-items:center; font-size:12px; color:var(--muted); cursor:pointer }
.chat-compose .web input{ accent-color:var(--accent) }
.chat-compose .model{ flex:1; font-size:11px; color:var(--muted); text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }

/* chat: transcript hygiene — tool calls and pre-tool commentary are hidden unless "tools" is on */
body:not(.show-tools) .seg-tool, body:not(.show-tools) .pre-tool{ display:none }
.seg-tool.running summary::before{ content:"◌"; animation:pulse 1.2s infinite }
.seg-tool .res .digest{ white-space:pre-wrap; color:var(--ink-soft); margin-bottom:6px }
.seg-tool .res a{ display:block; color:var(--accent); overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.msg.user .tags{ display:block; font-size:10.5px; color:var(--muted); margin-bottom:3px; white-space:normal }
.msg.user .body{ white-space:pre-wrap }
.msg .sources{ margin-top:8px; font-size:12px; border-top:1px dashed var(--line); padding-top:6px }
.msg .sources summary{ cursor:pointer; color:var(--muted); list-style:none; display:flex; gap:6px; align-items:baseline }
.msg .sources summary::-webkit-details-marker{ display:none }
.msg .sources summary::before{ content:"▸"; font-size:10px }
.msg .sources[open] summary::before{ content:"▾" }
.msg .sources a{ display:block; color:var(--accent); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding:2px 0 0 14px }
a.loc{ display:inline-block; font:600 11px/1.4 var(--sans); color:var(--c-chat-strong); background:var(--c-chat); border-radius:4px; padding:0 5px; text-decoration:none; vertical-align:baseline; white-space:nowrap }
a.loc:hover{ filter:brightness(.95) }
@keyframes locflash{ 0%{ background:var(--c-chat) } 100%{ background:transparent } }
#paper .loc-flash{ animation:locflash 1.6s ease-out }
.seg{ display:inline-flex; border:1px solid var(--line); border-radius:6px; overflow:hidden }
.seg button{ font-size:11.5px; padding:3px 8px; border:0; background:var(--ui); color:var(--muted); cursor:pointer }
.seg button.on{ background:var(--paper); color:var(--ink); font-weight:600 }
.seg button + button{ border-left:1px solid var(--line) }

/* ---------- human notes in chats, mentions ---------- */
.msg.note{ background:#fbf6e6; border:1px solid #ead9a6; border-left:4px solid var(--c-comment-strong); border-radius:4px 10px 10px 4px; padding:8px 12px; margin-right:28px }
.msg.note .tags{ display:block; font-size:10.5px; color:#7a5a00; margin-bottom:3px }
.msg.note .tags b{ font-weight:650 }
.msg.note .body{ white-space:pre-wrap }
.mention{ background:var(--c-chat); color:var(--c-chat-strong); border-radius:4px; padding:0 3px; font-weight:600 }
.mention.me{ background:var(--c-comment); color:#6b4c00 }
.card .at{ color:#fff; background:var(--c-chat-strong); border-radius:999px; padding:1px 7px; font-size:10.5px; font-weight:700; white-space:nowrap }
.card .at.new{ background:var(--c-correction-strong) }
.sb-section h3 .at{ color:#fff; background:var(--c-correction-strong); border-radius:999px; padding:1px 7px; font-size:10.5px; font-weight:700 }
.mention-menu{ position:absolute; z-index:65; background:var(--paper); border:1px solid var(--line); border-radius:8px; box-shadow:0 10px 30px rgba(0,0,0,.18); padding:4px; font-size:13px; min-width:200px }
.mention-menu[hidden]{ display:none }
.mention-menu div{ padding:5px 9px; border-radius:5px; cursor:pointer; display:flex; gap:8px; align-items:center }
.mention-menu div.on, .mention-menu div:hover{ background:var(--ui) }
.mention-menu .avatar{ width:18px; height:18px; font-size:9px }
.mention-menu small{ color:var(--muted) }
.chat-compose{ position:relative }

/* ---------- image attachments ---------- */
.att-row{ display:flex; align-items:center; gap:8px; flex-wrap:wrap }
.att-list{ display:flex; gap:6px; flex-wrap:wrap }
.att-list:empty{ display:none }
.att{ position:relative; width:64px; height:64px; border-radius:6px; overflow:hidden; border:1px solid var(--line); background:var(--ui); cursor:zoom-in; flex:none }
.att img{ width:100%; height:100%; object-fit:cover; display:block }
.att .rm{ position:absolute; top:2px; right:2px; width:18px; height:18px; border-radius:50%; border:0; background:rgba(0,0,0,.6); color:#fff; font-size:11px; line-height:18px; text-align:center; cursor:pointer; padding:0 }
.att.uploading{ opacity:.5 }
.att.failed{ border-color:var(--c-correction-strong) }
.att-list.thumbs .att{ width:84px; height:84px; cursor:zoom-in }
.card .att-list{ margin-top:6px }
.card .att{ width:56px; height:56px }
.msg.user .att-list{ margin-top:6px }
.chat-compose .att-list{ margin-bottom:6px }
#lightbox{ position:fixed; inset:0; z-index:90; background:rgba(20,18,12,.86); display:flex; align-items:center; justify-content:center; flex-direction:column; gap:10px; cursor:zoom-out; padding:24px }
#lightbox img{ max-width:96vw; max-height:88vh; box-shadow:0 20px 60px rgba(0,0,0,.5); background:#fff }
#lightbox .lb-name{ color:#eee; font-size:12px }
body.dragging #paper{ outline:none }
.chat-compose.drop, .ed.drop{ outline:2px dashed var(--accent); outline-offset:-4px }

/* ---------- print ---------- */
#printNotes{ display:none }
@media print{
  .topbar,#sidebar,#chat,#popover,#banner,dialog{ display:none !important }
  .layout{ display:block }
  body{ background:#fff; color:#000 }
  #paper{ box-shadow:none; margin:0; padding:0; max-width:none; border-radius:0; font-size:11.5pt }
  mark.ann,.ann-badge,.ann-ins{ -webkit-print-color-adjust:exact; print-color-adjust:exact }
  #printNotes{ display:block; font-family:var(--sans); font-size:9.5pt; margin-top:28px; border-top:1px solid #999; padding-top:12px; text-align:left }
  #printNotes h2{ font-size:12pt }
  #printNotes li{ margin-bottom:6px }
}
