/* Site feedback (feedback.js): the Comment button, the selection chip, the composer, pins and their threads.
   Built from site.css tokens so it reads as part of the site: pine for the furniture, lime as the one signal,
   white paper for anything you read or write. Fallbacks keep it whole if a page lacks site.css. */
.fb{--fb-pine:var(--pine-900,#0f231b);--fb-lime:var(--lime,#c4ee68);--fb-ink:var(--ink,#0e1914);--fb-ink-3:var(--ink-3,#5b6862);--fb-line:var(--line-2,#d3d9d2);--fb-surface:var(--surface,#fff);--fb-r:var(--r,6px);--fb-r-lg:var(--r-lg,12px);--fb-font:var(--font,ui-sans-serif,system-ui,sans-serif);--fb-shadow:0 18px 48px rgba(9,21,15,.2),0 2px 6px rgba(9,21,15,.08);font:400 15px/22px var(--fb-font);color:var(--fb-ink)}
.fb [hidden]{display:none !important}
.fb-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.fb button{font:inherit;cursor:pointer}
.fb h2{margin:0;font:650 16px/22px var(--fb-font);letter-spacing:-.01em}
.fb p{margin:0}

/* the dock: Comment, and the count of this page's threads */
.fb-dock{position:fixed;right:20px;bottom:calc(20px + var(--consent-h,0px) + env(safe-area-inset-bottom,0px));z-index:70;display:flex;gap:8px;align-items:center;transition:bottom .3s var(--ease,ease)}
.fb-launch,.fb-count{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 16px 0 13px;border-radius:var(--fb-r);border:1px solid var(--pine-line,rgba(232,240,234,.22));background:var(--fb-pine);color:var(--on-pine,#e8f0ea);font:600 14px/18px var(--fb-font);box-shadow:0 6px 22px rgba(9,21,15,.24);transition:background .2s,transform .12s}
.fb-launch svg{color:var(--fb-lime);flex:none}
.fb-launch:hover,.fb-count:hover{background:var(--pine-800,#18342a)}
.fb-launch:active{transform:translateY(1px)}
.fb-launch[aria-expanded="true"]{background:var(--fb-lime);color:var(--lime-ink,#0f231b);border-color:var(--fb-lime)}
.fb-launch[aria-expanded="true"] svg{color:var(--lime-ink,#0f231b)}
.fb-count{padding:0 12px;gap:6px;font:600 13px/1 var(--mono,ui-monospace,monospace)}
.fb-count svg{color:var(--on-pine-2,#a9bcb1)}
.fb :focus-visible{outline:2px solid var(--focus,#2a5d48);outline-offset:3px}
.fb-dock :focus-visible,.fb-pin:focus-visible,.fb-bar :focus-visible{outline:2px solid var(--fb-lime);outline-offset:3px;box-shadow:0 0 0 5px var(--fb-pine)}

/* the chip beside a selection */
.fb-layer{position:absolute;left:0;top:0;width:0;height:0;z-index:66}
.fb-chip{position:absolute;left:0;top:0;display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 13px 0 10px;border-radius:var(--fb-r);border:0;background:var(--fb-pine);color:var(--on-pine,#e8f0ea);font:600 14px/18px var(--fb-font);box-shadow:0 8px 24px rgba(9,21,15,.28);animation:fb-in .18s var(--ease,ease)}
.fb-chip svg{color:var(--fb-lime)}
.fb-chip::after{content:"";position:absolute;inset:-6px}

/* choosing a spot: the bar, a frame around what you would pick, nothing navigates */
html.fb-picking,html.fb-picking *{cursor:crosshair !important}
html.fb-picking iframe{pointer-events:none}
html.fb-picking [data-fb] *{cursor:pointer !important}
.fb-box{position:absolute;left:0;top:0;pointer-events:none;border-radius:var(--fb-r);outline:2px solid var(--pine-600,#2a5d48);box-shadow:0 0 0 5px rgba(196,238,104,.55);transition:transform .12s var(--ease,ease),width .12s var(--ease,ease),height .12s var(--ease,ease)}
.fb-bar{position:fixed;left:50%;top:calc(var(--head,64px) + 12px);transform:translateX(-50%);z-index:75;display:flex;align-items:center;gap:8px;max-width:calc(100vw - 24px);padding:8px 8px 8px 16px;border-radius:var(--fb-r-lg);border:1px solid var(--pine-line,rgba(232,240,234,.22));box-shadow:var(--fb-shadow);font:500 15px/20px var(--fb-font);animation:fb-drop .22s var(--ease,ease)}
.fb-bar p{margin-right:6px}
.fb-bar .btn{height:36px;padding:0 12px;font-size:14px}

/* pins, on the words or the part they belong to */
.fb-pin{position:absolute;left:0;top:0;width:24px;height:24px;padding:0;border-radius:50% 50% 50% 4px;border:0;background:var(--fb-lime);color:var(--lime-ink,#0f231b);font:700 12px/24px var(--mono,ui-monospace,monospace);text-align:center;box-shadow:0 0 0 2px #fff,0 3px 8px rgba(9,21,15,.25);transition:box-shadow .2s}
.fb-pin::after{content:"";position:absolute;inset:-8px}
.fb-pin.pub{background:#fff;color:var(--fb-pine);box-shadow:0 0 0 2px var(--fb-pine),0 3px 8px rgba(9,21,15,.2)}
.fb-pin:hover,.fb-pin[aria-expanded="true"]{box-shadow:0 0 0 2px #fff,0 0 0 5px rgba(196,238,104,.6),0 3px 8px rgba(9,21,15,.25)}
.fb-pin.fb-new{animation:fb-pop .6s var(--ease,ease) 2}
::highlight(fb-mine){background-color:rgba(196,238,104,.42)}
::highlight(fb-pub){background-color:rgba(10,101,133,.13)}
::highlight(fb-draft),::highlight(fb-active){background-color:rgba(196,238,104,.85);color:#0f231b}
.pine ::highlight(fb-mine){background-color:rgba(196,238,104,.26);text-decoration:underline 2px rgba(196,238,104,.9);text-underline-offset:4px}
.pine ::highlight(fb-pub){background-color:rgba(232,240,234,.14)}

/* paper cards: the composer, a thread, the list */
.fb-comp,.fb-pop,.fb-list{position:absolute;left:0;top:0;z-index:80;width:min(380px,calc(100vw - 32px));background:var(--fb-surface);color:var(--fb-ink);border:1px solid var(--fb-line);border-radius:var(--fb-r-lg);box-shadow:var(--fb-shadow);padding:16px 18px 18px;animation:fb-in .2s var(--ease,ease)}
.fb-comp:focus,.fb-pop:focus,.fb-list:focus{outline:none}
.fb-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:-2px -6px 10px 0}
.fb-x{display:inline-grid;place-items:center;width:32px;height:32px;border:0;border-radius:var(--fb-r);background:transparent;color:var(--fb-ink-3)}
.fb-x:hover{background:var(--inset,#f7f8f6);color:var(--fb-ink)}
.fb-ctx{padding:7px 10px;border-radius:var(--fb-r);background:var(--inset,#f7f8f6);box-shadow:inset 0 0 0 1px var(--line,#e3e7e2);color:var(--ink-2,#35423b);font:400 14px/20px var(--fb-font);overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow-wrap:anywhere}
.fb-f{display:grid;gap:6px;margin-top:14px;font:500 13px/16px var(--fb-font);color:var(--ink-2,#35423b)}
.fb-f i{font-style:normal;color:var(--fb-ink-3);font-weight:400}
.fb-f textarea,.fb-f input{width:100%;font:400 16px/22px var(--fb-font);color:var(--fb-ink);background:var(--fb-surface);border:1px solid var(--fb-line);border-radius:var(--fb-r);padding:9px 11px;transition:border-color .15s,box-shadow .15s}
.fb-f textarea{min-height:104px;resize:vertical}
.fb-f input{height:42px}
.fb-f textarea:hover,.fb-f input:hover{border-color:var(--fb-ink-3)}
.fb-f textarea:focus,.fb-f input:focus{outline:none;border-color:var(--pine-600,#2a5d48);box-shadow:0 0 0 3px rgba(196,238,104,.55)}
.fb-two{display:grid;grid-template-columns:1fr 1fr;gap:0 10px}
.fb-left{min-height:0;font:500 12px/16px var(--fb-font);color:var(--fb-ink-3);text-align:right}
.fb-left:not(:empty){margin-top:4px}
.fb-hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.fb-note{margin-top:12px !important;font:400 13px/18px var(--fb-font);color:var(--fb-ink-3)}
.fb-err{font:500 14px/20px var(--fb-font);color:#a3261b}
.fb-err:not(:empty){margin-top:10px}
.fb-acts{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px;margin-top:16px}
.fb-acts .btn{height:40px;padding:0 15px;font-size:14px}
.fb-acts .btn[disabled]{opacity:.6;cursor:progress}
.fb-alt,.fb-go{margin-right:auto;padding:8px 0;border:0;background:none;color:var(--pine-600,#2a5d48);font:600 14px/20px var(--fb-font)}
.fb-alt:hover,.fb-go:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}

.fb-body{margin-top:10px !important;font:400 15px/22px var(--fb-font);white-space:pre-wrap;overflow-wrap:anywhere}
.fb-meta{margin-top:8px !important;font:500 13px/18px var(--fb-font);color:var(--fb-ink-3)}
.fb-rep{margin-top:12px;padding:2px 0 0 12px;border-left:2px solid var(--fb-line)}
.fb-rep .fb-meta{margin-top:0 !important;color:var(--ink-2,#35423b)}
.fb-rep .fb-body{margin-top:4px !important}
.fb-pop .fb-note,.fb-list .fb-note{margin-top:8px !important;color:#8a5a00}

.fb-list{position:fixed;left:auto;top:auto;right:20px;bottom:calc(76px + var(--consent-h,0px));max-height:min(560px,calc(100svh - 120px));overflow:auto;overscroll-behavior:contain}
.fb-list ol{list-style:none;margin:0;padding:0}
.fb-list li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:12px;padding:14px 0;border-top:1px solid var(--line,#e3e7e2)}
.fb-list li:first-child{border-top:0;padding-top:4px}
.fb-n{width:24px;height:24px;border-radius:50% 50% 50% 4px;background:var(--fb-lime);color:var(--lime-ink,#0f231b);font:700 12px/24px var(--mono,ui-monospace,monospace);text-align:center}
.fb-go{margin-top:6px}

/* a comment on the whole page sits by the dock */
.fb-comp.docked{position:fixed;left:auto;top:auto;right:20px;bottom:calc(76px + var(--consent-h,0px));transform:none !important}

.fb-toast{position:fixed;left:50%;bottom:calc(84px + var(--consent-h,0px));z-index:85;transform:translate(-50%,8px);max-width:calc(100vw - 32px);padding:10px 16px;border-radius:var(--fb-r);background:var(--pine-800,#18342a);border:1px solid rgba(232,240,234,.3);color:var(--on-pine,#e8f0ea);font:500 14px/20px var(--fb-font);box-shadow:var(--fb-shadow);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s var(--ease,ease)}
.fb-toast.on{opacity:1;transform:translate(-50%,0)}
.fb-toast:empty{display:none}

.fb-scrim{position:fixed;inset:0;z-index:78;background:rgba(9,21,15,.36);animation:fb-fade .2s}

/* the footer's quiet way in */
.fb-foot{padding:0;border:0;background:none;color:var(--ink-2,#35423b);font:inherit;cursor:pointer}
.fb-foot:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}

/* phones: icon-only Comment, sheets from the bottom */
@media (max-width:760px){
	.fb-dock{right:16px;bottom:calc(16px + var(--consent-h,0px) + env(safe-area-inset-bottom,0px))}
	.fb-launch{width:44px;padding:0;justify-content:center}
	.fb-launch-t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
	.fb-bar{left:12px;right:12px;transform:none;flex-wrap:wrap;padding:12px;font-size:14px}
	.fb-bar p{flex:1 1 100%;margin:0 0 4px}
	.fb-comp.sheet,.fb-pop.sheet,.fb-list.sheet,.fb-comp.docked{position:fixed;left:0;right:0;top:auto;bottom:0;width:auto;max-height:88svh;overflow:auto;overscroll-behavior:contain;transform:none !important;border-radius:16px 16px 0 0;border-width:1px 0 0;padding:16px 16px calc(18px + env(safe-area-inset-bottom,0px));animation:fb-up .26s var(--ease,ease)}
	.fb-two{grid-template-columns:1fr}
	.fb-acts .btn{flex:1 1 auto;justify-content:center;height:44px}
	.fb-alt{flex:1 1 100%;text-align:left}
	.fb-toast{bottom:calc(76px + var(--consent-h,0px))}
}
@keyframes fb-in{from{opacity:0;translate:0 4px}}
@keyframes fb-drop{from{opacity:0;translate:0 -6px}}
@keyframes fb-up{from{translate:0 24px;opacity:.4}}
@keyframes fb-fade{from{opacity:0}}
@keyframes fb-pop{50%{box-shadow:0 0 0 2px #fff,0 0 0 9px rgba(196,238,104,.55),0 3px 8px rgba(9,21,15,.25)}}
@media (prefers-reduced-motion:reduce){.fb *,.fb-box{animation:none !important;transition:none !important}}
@media print{.fb{display:none !important}}