/* AgentGuard Score for Grok Bot templates */
.ts { max-width: 880px; margin: 0 auto; padding: 32px 16px 64px; }
.ts-hero h1 { font-size: clamp(28px, 5vw, 44px); line-height: 1.1; margin: 0 0 12px; }
.ts-sub { font-size: 18px; color: #94a3b0; margin: 0 0 24px; }
.ts-input label { display: block; font-weight: 600; margin-bottom: 8px; }
.ts-input textarea { width: 100%; box-sizing: border-box; min-height: 240px; padding: 14px; border: 1px solid #d1d5db; border-radius: 12px; font: 14px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; resize: vertical; }
.ts-input textarea:focus { outline: 2px solid #2abcb4; outline-offset: 2px; }
.ts-help { margin: 12px 0; }
.ts-help summary { cursor: pointer; font-weight: 600; display: list-item; min-height: 44px; line-height: 44px; }
.ts-privacy { font-size: 14px; color: #94a3b0; }
.ts-button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; background: #2abcb4; color: #04201e; border: 0; border-radius: 999px; padding: 12px 22px; font-weight: 700; font-size: 16px; cursor: pointer; text-decoration: none; }
.ts-button:hover { filter: brightness(1.05); }
.ts-secondary { background: #e6f7f6; color: #0b4f4b; }
.ts-result { margin: 32px 0; padding: 24px; border: 1px solid #e5e7eb; border-radius: 20px; background: #fff; color: #111827; box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06); animation: ts-in 240ms ease-out; scroll-margin-top: 16px; }
@keyframes ts-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .ts-result { animation: none; } }
.ts-top { display: flex; align-items: center; gap: 20px; }
.ts-grade { flex: 0 0 auto; width: 88px; height: 88px; border-radius: 24px; display: grid; place-items: center; font-size: 52px; font-weight: 800; color: #fff; }
.ts-grade-A { background: #15803d; }
.ts-grade-B { background: #2abcb4; }
.ts-grade-C { background: #ca8a04; }
.ts-grade-D { background: #ea580c; }
.ts-grade-F { background: #dc2626; }
.ts-grade-U { background: #6b7280; }
.ts-headline { font-size: 20px; font-weight: 600; margin: 0; }
.ts h2 { font-size: 14px; text-transform: uppercase; letter-spacing: 0.04em; color: #6b7280; margin: 28px 0 10px; }
.ts-facts { margin: 0; padding-left: 22px; }
.ts-facts li { margin: 0 0 12px; }
.ts-rule { color: #6b7280; font-size: 13px; }
.ts-quote { display: block; margin-top: 4px; font: 13px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; color: #374151; background: #f8fafc; border-left: 3px solid #2abcb4; padding: 6px 10px; border-radius: 6px; overflow-wrap: anywhere; quotes: none; }
.ts-chips { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ts-chip { padding: 6px 12px; border-radius: 999px; background: #eef2ff; color: #1e293b; font-size: 14px; }
.ts-chip-muted, .ts-cov-not_provided, .ts-cov-could_not_parse { background: #f3f4f6; color: #6b7280; }
.ts-cov-read { background: #e6f7f6; color: #0b4f4b; }
.ts-hidden p { margin: 0 0 8px; }
.ts-hidden-line { font: 13px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; overflow-wrap: anywhere; }
.ts-hidden-line mark { background: #fde68a; color: #7c2d12; border-radius: 4px; padding: 0 3px; }
.ts-line { color: #6b7280; font-size: 13px; }
.ts-meta { color: #6b7280; font-size: 13px; margin-top: 24px; }
.ts-honesty-line, .ts-honesty p { font-size: 14px; margin: 6px 0; }
.ts-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.ts-share-note { font-size: 13px; color: #6b7280; }
.ts-share-out { font-size: 14px; overflow-wrap: anywhere; }
.ts-note { background: #fffbeb; border: 1px solid #fde68a; color: #78350f; padding: 12px 14px; border-radius: 12px; }
.ts-more { margin-top: 32px; }
@media (max-width: 520px) {
  .ts-top { align-items: flex-start; }
  .ts-grade { width: 64px; height: 64px; font-size: 38px; border-radius: 18px; }
}
