:root{--hl-reader: rgba(255, 255, 189, .48);--hl-author: rgba(111, 219, 255, .19);--comment-byline: #a8a8a8;--comment-author: #8fd3e8;--popover-bg: #262626}.header__tools{display:flex;align-items:center;gap:18px;justify-self:end}.header__pen{display:grid;place-items:center;width:31px;height:31px;flex-shrink:0;color:var(--ink);opacity:.85;transition:opacity .16s var(--ease),color .16s var(--ease)}.header__pen:hover{opacity:1}.header__pen svg{width:22px;height:22px}.shell[data-comments=on] .header__pen{color:var(--accent);opacity:1}.hl{background:none;color:inherit;cursor:text;border-radius:1px;transition:background-color .26s var(--ease)}.shell[data-comments=on] .hl{cursor:help;background:var(--hl-reader)}.shell[data-comments=on] .hl[data-kind=author]{background:var(--hl-author)}.shell[data-comments=on] .hl[data-active=true]{background:#ffe9789e}.shell[data-comments=on] .hl[data-kind=author][data-active=true]{background:#6fdbff57}.shell[data-comments=on] .hl:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.popover{position:absolute;z-index:30;width:min(345px,calc(100vw - 48px));padding:19px 25px;border-radius:9px;background:var(--popover-bg);color:#fff;font-family:var(--sans);font-size:var(--fs-note);font-weight:500;letter-spacing:.42px;line-height:var(--lh-note);box-shadow:0 2px 4px #14100c1f,0 8px 20px #14100c29;opacity:0;transform:translateY(-4px);pointer-events:none;transition:opacity .18s var(--ease),transform .18s var(--ease)}.popover[data-open=true]{opacity:1;transform:none;pointer-events:auto}.comment__body{margin:0}.comment__meta{margin:0;font-style:italic;color:var(--comment-byline)}.comment__author{color:var(--comment-author)}@media (max-width: 600px){.popover{padding:16px 20px}}