/* The live spam check inside "The same network, two more ways": it reuses the violet box, field, pills and state line of try-it.css and only adds its own title and the Spam / Not spam verdict. */
.spam-try-it { padding-bottom: 52px; } /* space before the next section */
.spam-try-it .try-it-box { margin-top: 22px; } /* box sits below the section text */
.case-section .try-it-box h3 { margin-bottom: 6px; font: 700 clamp(21px, 2.4vw, 26px)/1.2 var(--display); letter-spacing: -0.01em; } /* box title */
.case-section .try-it-box p.spam-box-intro { margin-bottom: 16px; font-size: 16px; line-height: 1.5; } /* what the box checks */
.try-it-form.spam-form textarea { min-height: 116px; } /* room for a whole text message */
.case-section .try-it-box p.spam-verdict { display: inline-block; padding: 6px 20px; border-radius: 99px; color: #17102f; font: 700 clamp(22px, 3vw, 28px)/1.2 var(--display); } /* the big answer, dark text on its colour (beats the white box text) */
.spam-verdict[data-verdict="spam"] { background: var(--recording); } /* red: spam */
.spam-verdict[data-verdict="not-spam"] { background: var(--live); } /* green: not spam */
.case-section .try-it-box p.spam-checked { margin: 12px 0 6px; padding-left: 14px; border-left: 3px solid var(--amber); font: 500 16px/1.45 var(--body); overflow-wrap: anywhere; } /* the text that was checked */