a{ text-decoration:none;} .text-counter-container { --primary:#f97316;--secondary:#f59e0b;--bs-primary:#f97316;--bs-primary-rgb:249, 115, 22;font-family:"Inter", system-ui, sans-serif;background-color:#f8f9fa;padding:20px;} .text-counter-container .btn-primary { background-color:var(--primary);border-color:var(--primary);} .text-counter-container .btn-primary:hover { background-color:#e16514;border-color:#e16514;} .text-counter-container .text-primary { color:var(--primary) !important;} .text-counter-container .bg-primary { background-color:var(--primary) !important;} .text-counter-container .counter-animation { transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);} .text-counter-container .highlight-keyword { background-color:rgba(249, 115, 22, 0.2);padding:1px 2px;border-radius:2px;} .text-counter-container .progress-bar { transition:width 0.5s ease-in-out;} .text-counter-container .accordion-content { max-height:0;overflow:hidden;transition:max-height 0.3s ease-in-out;} .text-counter-container .accordion-content.active { max-height:200px;} .text-counter-container .fade-in { animation:fadeIn 0.3s ease-in-out;} @keyframes fadeIn { from { opacity:0;transform:translateY(10px);} to { opacity:1;transform:translateY(0);} } .text-counter-container .pulse-animation { animation:pulse 2s infinite;} @keyframes pulse { 0%, 100% { opacity:1;} 50% { opacity:0.7;} } .text-counter-container .title-badge { position:absolute;top:-20px;right:-10px;background-color:var(--primary);color:white;font-size:0.7rem;padding:0.25rem 0.5rem;border-radius:20px;animation:pulse 2s infinite;} .text-counter-container .stat-card { background-color:#f8f9fa;border-radius:12px;padding:1.5rem;height:100%;} .text-counter-container .stat-icon { width:3rem;height:3rem;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;} .text-counter-container .gradient-text { background:linear-gradient(90deg, var(--primary), var(--secondary));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;} .text-counter-container .keyword-pill { display:inline-block;background:linear-gradient(45deg, var(--primary), var(--secondary));color:white;padding:0.35rem 0.8rem;border-radius:20px;margin:0.25rem;font-size:0.85rem;box-shadow:0 2px 4px rgba(0, 0, 0, 0.1);} .text-counter-container .analysis-section { background-color:white;border-radius:12px;padding:1.5rem;margin-bottom:1.5rem;box-shadow:0 4px 6px rgba(0, 0, 0, 0.05);} .text-counter-container .top-keyword { padding:0.75rem;border-radius:10px;margin-bottom:0.75rem;background-color:#f8f9fa;transition:all 0.3s;position:relative;} .text-counter-container .top-keyword:hover { background-color:#e9ecef;transform:translateY(-3px);} .text-counter-container .top-keyword-rank { width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:bold;color:white;font-size:0.9rem;background:linear-gradient(45deg, var(--primary), var(--secondary));} .text-counter-container .keyword-badge { position:absolute;top:-10px;right:-8px;background-color:var(--primary);color:white;font-size:0.7rem;padding:0.2rem 0.5rem;border-radius:20px;display:none;} .text-counter-container .top-keyword:hover .keyword-badge { display:block;} .text-counter-container .suggestion-card { border-left:4px solid;transition:all 0.3s;} .text-counter-container .suggestion-card:hover { transform:translateX(5px);} @media (max-width:768px) { .text-counter-container .stat-card { padding:1rem;} .text-counter-container .display-4 { font-size:2.5rem;} .text-counter-container .btn-lg { padding:0.5rem 1rem;font-size:0.9rem;} .text-counter-container #textInput { min-height:150px;} .text-counter-container .title-badge { top:-30px;right:0px;font-size:0.6rem;} }