/* "Feedback" pop-up (_feedback.html, feedback.js), loaded by the feed (base.html) and the Newsletter view.
   Colours come from each page's theme variables (--ink, --mut, --blue, --bg); the dark Grok theme and the Notion
   "paper" theme only swap the surfaces. */
/* the row under the caption (feed) / date line (Newsletter view): Feedback pill + language switcher */
.tools{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:6px;margin:8px 0 -4px}
.tools .langs{margin:0}
.nl .tools{justify-content:flex-start;gap:8px;margin-top:12px}
.fbb{display:inline-flex;align-items:center;gap:5px;font:700 11.5px/1 sans-serif;font-family:inherit;color:#5b606a;background:#e9eaee;border:0;border-radius:999px;padding:7px 11px;cursor:pointer;white-space:nowrap}
.fbb[hidden]{display:none}
.fbb svg{width:13px;height:13px;flex:none;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linejoin:round}
.fbb:hover{color:var(--blue)}.fbb:focus-visible{outline:2px solid var(--blue);outline-offset:1px}
.nl .fbb{font-size:13px;font-weight:800;color:var(--ink);background:#fff;padding:10px 14px;box-shadow:0 6px 18px rgba(0,0,0,.05)}
.nl .fbb svg{width:14px;height:14px}

/* the dialog */
.fbm{width:min(440px,calc(100vw - 24px));max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);margin:auto;padding:0;border:0;border-radius:18px;background:#fff;color:var(--ink);box-shadow:0 20px 60px rgba(0,0,0,.25);overflow:auto;overscroll-behavior:contain}
.fbm::backdrop{background:rgba(15,16,20,.42)}
.fbm[open]{animation:fbin .18s ease}
@keyframes fbin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.fbm[open]{animation:none}}
.fbf{display:flex;flex-direction:column;padding:16px 18px 18px;font-size:14px;line-height:1.5}
.fbtop{display:flex;align-items:center;justify-content:space-between;gap:12px}
.fbtop h2{margin:0;font-size:17px;font-weight:800;line-height:1.3;letter-spacing:0;text-transform:none}
.fbx{flex:none;width:32px;height:32px;border-radius:50%;border:0;background:#f1f3f7;color:var(--ink);font-size:13px;font-weight:900;cursor:pointer}
.fbx:hover{background:#e6ebf7;color:var(--blue)}
.fbi{margin:4px 0 12px;color:var(--mut);font-size:13.5px}
.fbf label{font-size:13px;font-weight:700;margin:0 0 5px}
.fbf input,.fbf textarea{box-sizing:border-box;width:100%;min-width:0;font:500 16px/1.4 sans-serif;font-family:inherit;color:var(--ink);background:#f6f7f9;border:1px solid #e1e4ea;border-radius:10px;padding:10px 12px;margin:0 0 12px}
.fbf textarea{resize:vertical;min-height:110px;max-height:45vh}
.fbf input::placeholder,.fbf textarea::placeholder{color:var(--mut);opacity:.8}
.fbf input:focus,.fbf textarea:focus{outline:2px solid var(--blue);outline-offset:1px;background:#fff}
.fbf [aria-invalid=true]{border-color:#dc2626}
.fbhp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fbmsg{margin:0 0 10px;font-size:13px;font-weight:600}.fbmsg:empty{display:none}
.fbmsg.ok{color:#15803d}.fbmsg.err{color:#b91c1c}
.fbs{align-self:stretch;font:800 15px/1 sans-serif;font-family:inherit;color:#fff;background:var(--blue);border:0;border-radius:10px;min-height:44px;padding:0 18px;cursor:pointer}
.fbs:hover{filter:brightness(.92)}.fbs[disabled]{opacity:.6;cursor:default}
.fbs:focus-visible,.fbx:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
@media (max-width:380px){.fbf{padding:14px 14px 16px}}
html:is(:lang(ja),:lang(zh-Hans)) .fbm :is(.fbi,.fbmsg){line-height:1.75}

/* Grok Bot: dark */
[data-section=grok] .fbb{background:#1c1d21;color:#8d9098}[data-section=grok] .fbb:hover{color:#fff}
[data-section=grok].nl .fbb{background:#17181b;color:var(--ink);box-shadow:0 0 0 1px #26272c}
[data-section=grok] .fbm{background:#121315;box-shadow:0 0 0 1px #26272c,0 20px 60px rgba(0,0,0,.6)}
[data-section=grok] .fbm::backdrop{background:rgba(0,0,0,.6)}
[data-section=grok] .fbx{background:#222328}[data-section=grok] .fbx:hover{background:#2e3036;color:#fff}
[data-section=grok] .fbf input,[data-section=grok] .fbf textarea{background:#1b1c20;border-color:#2a2b30}
[data-section=grok] .fbf input:focus,[data-section=grok] .fbf textarea:focus{background:#202126}
[data-section=grok] .fbs{background:#f2f3f5;color:#0b0b0d}
[data-section=grok] .fbmsg.ok{color:#4ade80}[data-section=grok] .fbmsg.err{color:#f87171}
[data-section=grok] .fbf [aria-invalid=true]{border-color:#f87171}

/* Notion: warm off-white paper, near-black ink */
[data-section=notion] .fbb{background:#ecebe7;color:#6f6e69;box-shadow:inset 0 0 0 1px #e3e2de}[data-section=notion] .fbb:hover{color:#191919}
[data-section=notion].nl .fbb{background:#fff;color:var(--ink);box-shadow:0 0 0 1px #e6e4df}
[data-section=notion] .fbm{border-radius:14px;box-shadow:0 0 0 1px #e6e4df,0 20px 60px rgba(15,15,15,.18)}
[data-section=notion] .fbx{background:#f1f0ec}[data-section=notion] .fbx:hover{background:#e7e5df;color:#191919}
[data-section=notion] .fbf input,[data-section=notion] .fbf textarea{background:#f7f6f3;border-color:#e3e2de}
[data-section=notion] .fbs{background:#191919}