.stf-container{flex-direction:column;gap:6px;width:100%;margin:0;padding:2px 0;display:flex}.stf-scroll-wrapper{align-items:center;display:flex;position:relative}.stf-scroll-container{scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;flex:1;gap:8px;padding:4px 0;display:flex;overflow-x:auto}.stf-scroll-container::-webkit-scrollbar{display:none}.stf-chip{color:#374151;cursor:pointer;white-space:nowrap;background-color:#fff;border:1.5px solid #e5e7eb;border-radius:18px;flex-shrink:0;align-items:center;gap:4px;padding:6px 12px;font-size:.8rem;font-weight:500;transition:all .2s;display:inline-flex}.stf-chip:hover{color:#3b82f6;background-color:#f0f9ff;border-color:#3b82f6;box-shadow:0 2px 6px #3b82f61a}.stf-chip.stf-active{color:#fff;background-color:#3b82f6;border-color:#3b82f6;box-shadow:0 3px 10px #3b82f633}.stf-chip.stf-active:hover{background-color:#2563eb;border-color:#2563eb;box-shadow:0 3px 12px #2563eb40}.stf-chip-text{text-overflow:ellipsis;flex-shrink:1;overflow:hidden}.stf-chip-close{flex-shrink:0;width:14px;height:14px;display:none}.stf-chip.stf-active .stf-chip-close{cursor:pointer;display:inline-flex}.stf-chip-close:hover{opacity:.7}.stf-loading-state,.stf-empty-state{text-align:center;color:#9ca3af;padding:12px 20px;font-size:.8rem}.stf-loading-state{justify-content:center;align-items:center;gap:6px;display:flex}.stf-loading-state:before{content:"";border:2px solid #e5e7eb;border-top-color:#3b82f6;border-radius:50%;width:12px;height:12px;animation:.8s linear infinite stf-spin}@keyframes stf-spin{to{transform:rotate(360deg)}}.stf-skeleton-row{gap:8px;width:100%;display:flex;overflow:hidden}.stf-skeleton-chip{background:linear-gradient(90deg,#e5e7eb 25%,#f3f4f6 50%,#e5e7eb 75%) 0 0/200% 100%;border-radius:18px;flex:1 0 80px;min-width:60px;max-width:120px;height:32px;animation:1.5s ease-in-out infinite stf-skeleton-shimmer;display:inline-flex}@keyframes stf-skeleton-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.stf-more-btn{color:#1d4ed8;cursor:pointer;white-space:nowrap;letter-spacing:-.5px;background-color:#f0f7ff;border:1.5px solid #2563eb;border-radius:18px;flex-shrink:0;justify-content:center;align-items:center;min-width:44px;height:32px;padding:6px 14px;font-size:.85rem;font-weight:700;transition:all .2s;display:inline-flex;box-shadow:0 1px 3px #2563eb1f}.stf-more-btn:hover:not(:disabled){color:#fff;background-color:#2563eb;border-color:#1d4ed8;transform:translateY(-1px);box-shadow:0 3px 8px #2563eb40}.stf-more-btn:disabled{opacity:.7;cursor:not-allowed}.stf-more-icon{justify-content:center;align-items:center;line-height:1;transition:transform .2s;display:inline-flex}.stf-more-btn:hover:not(:disabled) .stf-more-icon{transform:translateY(2px)}.stf-more-spinner{border:2px solid #93c5fd;border-top-color:#1d4ed8;border-radius:50%;width:13px;height:13px;animation:.8s linear infinite stf-spin}.stf-more-btn:hover .stf-more-spinner{border-color:#fff #fff6 #fff6}@media (max-width:768px){.stf-container{gap:8px;margin:10px 0 16px;padding:8px 0}.stf-chip{gap:3px;padding:5px 10px;font-size:.75rem}.stf-more-btn{border-radius:16px;min-width:38px;height:28px;padding:5px 11px;font-size:.8rem}.stf-skeleton-row{gap:6px}.stf-skeleton-chip{border-radius:16px;flex:60px;min-width:50px;max-width:100px;height:28px}}@media (max-width:480px){.stf-container{gap:6px;margin:0;padding:2px 0}.stf-chip{border-width:1px;gap:2px;padding:4px 8px;font-size:.7rem}.stf-chip-close{width:12px;height:12px}.stf-more-btn{border-width:1px;border-radius:14px;min-width:34px;height:24px;padding:3px 9px;font-size:.75rem}.stf-skeleton-row{gap:5px}.stf-skeleton-chip{border-radius:14px;flex:50px;min-width:40px;max-width:80px;height:24px}}@media (max-width:360px){.stf-skeleton-row{gap:4px}.stf-skeleton-chip{border-radius:12px;flex:40px;min-width:35px;max-width:70px;height:22px}}.stf-filter-trigger{color:#475569;cursor:pointer;background-color:#f8fafc;border:1.5px dashed #cbd5e1;align-items:center;gap:6px;font-weight:500;transition:all .2s;display:inline-flex}.stf-filter-trigger:hover{color:#3b82f6;background-color:#eff6ff;border-style:solid;border-color:#3b82f6;box-shadow:0 2px 6px #3b82f61a}.stf-trigger-icon{color:#64748b;transition:color .2s}.stf-filter-trigger:hover .stf-trigger-icon{color:#3b82f6}
