/* Shared by the feed and the branch page: the vote bar, the account control, the
   replies list. Tokens come from whichever page hosts it (same names in both). */
.votebar{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.vote{ display:inline-flex; align-items:center; gap:6px; padding:5px 10px; border-radius:999px;
  border:1px solid var(--line); background:var(--surface); color:var(--ink-soft);
  font:inherit; font-size:13.5px; line-height:1; cursor:pointer; font-variant-numeric:tabular-nums; }
.vote svg{ width:15px; height:15px; fill:currentColor; }
.vote.dislike svg{ transform:scaleY(-1); }
.vote b{ color:var(--ink); font-weight:600; }
.vote:hover{ border-color:var(--ink-soft); }
.vote.on{ background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }
.vote.on b{ color:inherit; }
.vote.dislike.on{ background:var(--danger); border-color:var(--danger); }
.votemsg{ color:var(--danger); font-size:12.5px; }
.acct{ display:flex; align-items:center; gap:10px; font-size:13.5px; }
.acct .me{ color:var(--ink); font-weight:500; font-family:"IBM Plex Mono",monospace; }
.acct form.signin{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:0; }
.acct form.signin input{ font:inherit; font-size:13.5px; padding:7px 10px; border-radius:8px; min-width:0; width:200px; max-width:100%;
  border:1px solid var(--line); background:var(--surface); color:var(--ink); }
.acct form.signin input:focus{ outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent); }
.acct form.signin button{ font:inherit; font-size:13.5px; padding:7px 12px; border-radius:8px; cursor:pointer;
  border:1px solid var(--accent); background:var(--accent); color:var(--accent-ink); }
.acct form.signin button:disabled{ opacity:.6; cursor:default; }
.acct form.signin .hint{ flex-basis:100%; color:var(--ink-soft); font-size:12.5px; }
.acct form.signin.sent input, .acct form.signin.sent button{ display:none; }
.acct form.signin.sent .hint{ color:var(--ink); }
.acct .linkbtn{ font:inherit; font-size:13px; background:none; border:0; padding:0; color:var(--ink-soft);
  text-decoration:underline; cursor:pointer; }
.acct .autherr{ color:var(--danger); font-size:12.5px; }
.replies h4{ margin:0 0 6px; font-size:13px; font-weight:600; color:var(--ink-soft); text-transform:uppercase; letter-spacing:.04em; }
.replies .none{ color:var(--ink-soft); font-size:13.5px; }
.reply{ display:flex; flex-direction:column; gap:2px; text-decoration:none; padding:8px 10px; border-radius:8px;
  border:1px solid var(--line); background:var(--surface); margin:6px 0; text-align:left; }
.reply:hover{ border-color:var(--ink-soft); }
.reply .t{ color:var(--ink); font-weight:500; overflow-wrap:anywhere; }
.reply .w{ color:var(--ink-soft); font-size:12.5px; }
/* the branch page footer (built by the cloud shim) */
.cloudfoot{ max-width:640px; margin:0 auto; padding:10px 16px 28px; display:flex; flex-direction:column; gap:12px;
  text-align:left; font-size:13px; color:var(--ink-soft); }
.cloudfoot .whoby b{ color:var(--ink); font-weight:600; }
.cloudfoot .whoby a{ color:inherit; }
.cloudfoot .inreply a{ color:var(--ink); }
.cloudfoot .replyhow{ font-size:12.5px; border-top:1px solid var(--line); padding-top:10px; }
.cloudfoot .replyhow code{ font-family:"IBM Plex Mono",monospace; font-size:12px; background:var(--surface2); padding:1px 5px; border-radius:4px; }