/* Free-tool card inside blog posts (2026-10-12). Injected by the worker after the first content section;
   see toolCardHtml() in src/worker.js and js/tool-card.js. Self-contained: posts load either blog.css or
   blog-v8.css, so this file carries its own colours. */
.tcard{margin:40px 0;padding:22px 24px 20px;border-radius:14px;background:#0F0F11;border:1px solid rgba(248,179,0,.24);color:#F4F4F5}
.tcard *{box-sizing:border-box}
.tcard p{margin:0}
.tcard .tcard-eyebrow{font:600 11.5px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.08em;text-transform:uppercase;color:#f8b300;margin-bottom:10px}
.tcard .tcard-h{font-size:18px;line-height:1.3;font-weight:650;letter-spacing:-.01em;color:#F4F4F5;margin-bottom:6px}
.tcard .tcard-p{font-size:14.5px;line-height:1.55;color:#A1A1AA;margin-bottom:16px;max-width:60ch}
.tcard-form{display:flex;flex-direction:column;gap:10px}
.tcard-form textarea{width:100%;min-height:84px;resize:vertical;padding:12px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#F4F4F5;font:inherit;font-size:15px;line-height:1.5;transition:border-color .15s,box-shadow .15s}
.tcard-form textarea::placeholder{color:#8B8B94}
.tcard-form textarea:focus{outline:none;border-color:#f8b300;box-shadow:0 0 0 3px rgba(248,179,0,.2)}
.tcard-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.tcard-btn{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 20px;border:0;border-radius:10px;background:#f8b300;color:#151412;font:inherit;font-size:15px;font-weight:650;text-decoration:none;cursor:pointer;transition:background .15s}
.tcard-btn:hover{background:#ffcb47;color:#151412}
.tcard-btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
.tcard-btn:disabled{opacity:.7;cursor:default}
.tcard-note{font-size:13px;color:#8B8B94}
.tcard-err{font-size:13.5px;color:#ff8a8d;min-height:0}
.tcard-out{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08)}
.tcard-out[hidden]{display:none}
.tcard .tcard-verdict{font-size:17px;font-weight:650;color:#F4F4F5;margin-bottom:4px}
.tcard .tcard-why{font-size:14.5px;line-height:1.55;color:#C9C6BF;margin-bottom:14px}
.tcard-meter{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.tcard-meter .track{flex:1;height:8px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}
.tcard-meter .fill{display:block;height:100%;width:100%;border-radius:99px;background:#f8b300;transform-origin:left center;transform:scaleX(0);transition:transform .5s ease-out}
.tcard-meter .pct{font:600 13px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#F4F4F5;white-space:nowrap}
.tcard-links{display:flex;gap:18px;flex-wrap:wrap;font-size:14px}
.tcard-links a,.tcard-links button{color:#f8b300;font:inherit;font-weight:600;background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.tcard-links a:hover,.tcard-links button:hover{color:#ffcb47}
.tcard-links button:disabled{color:#A1A1AA;text-decoration:none;cursor:default}
.tcard-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (max-width:560px){.tcard{padding:20px 18px 18px}.tcard-btn{width:100%}}
@media (prefers-reduced-motion:reduce){.tcard-meter .fill{transition:none}}