body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background: #f8f9fa; margin: 0; padding: 0; }
header { background: #2c3e50; color: white; padding: 20px; text-align: center; }
main { max-width: 900px; margin: 30px auto; padding: 25px; background: white; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }
textarea { width: 100%; height: 120px; border: 2px solid #ddd; border-radius: 8px; padding: 15px; font-size: 1.1rem; box-sizing: border-box; }
#output-box { margin-top: 25px; padding: 20px; background: #f1f3f5; border-left: 5px solid #2c3e50; border-radius: 4px; min-height: 60px; font-size: 1.25rem; white-space: pre-wrap; }
.hl { color: #e67e22; font-weight: bold; }
footer { text-align: center; padding: 20px; color: #7f8c8d; font-size: 0.9rem; }
table tr:hover { background-color: #f1f1f1; }
table th { text-align: left; }