.stats-bar{display:grid;grid-template-columns:repeat(3, 1fr);gap:20px;margin-bottom:24px}.stat-item{background:linear-gradient(135deg, #667eea 0, #764ba2 100%);border-radius:20px;padding:20px;text-align:center;color:white}.stat-number{font-size:2rem;font-weight:700;margin-bottom:8px}.stat-label{font-size:0.85rem;opacity:0.9}.preview-settings{background:var(--gray-50);border-radius:16px;padding:20px;margin-bottom:24px;display:flex;flex-wrap:wrap;gap:24px;align-items:center}.settings-group{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.settings-group label{font-weight:500;color:var(--gray-700)}.settings-input{padding:8px 16px;border:1px solid var(--gray-300);border-radius:30px;width:250px}.settings-group input[type="range"]{width:150px}.size-value{min-width:45px;font-weight:500;color:var(--primary-color)}.settings-group input[type="color"]{width:50px;height:36px;border:1px solid var(--gray-300);border-radius:8px;cursor:pointer}.category-filter{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px}.category-btn{background:var(--gray-100);border:1px solid var(--gray-200);padding:8px 20px;border-radius:40px;cursor:pointer;transition:all 0.2s}.category-btn.active{background:var(--primary-color);color:white;border-color:var(--primary-color)}.category-btn:hover:not(.active){background:var(--gray-200)}.font-list-container{border:1px solid var(--gray-200);border-radius:16px;overflow:hidden;margin-bottom:20px}.font-list-header{display:grid;grid-template-columns:200px 1fr 100px 80px;background:var(--gray-50);padding:12px 16px;font-weight:600;border-bottom:1px solid var(--gray-200);color:var(--gray-700)}.font-list{max-height:500px;overflow-y:auto}.font-item{display:grid;grid-template-columns:200px 1fr 100px 80px;padding:12px 16px;border-bottom:1px solid var(--gray-100);align-items:center;transition:background 0.2s}.font-item:hover{background:var(--gray-50)}.font-name{font-weight:500;color:var(--gray-800)}.font-preview{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.font-category{font-size:0.75rem;padding:4px 10px;border-radius:20px;background:var(--gray-100);display:inline-block;width:fit-content}.font-actions{display:flex;gap:8px}.font-actions button{background:transparent;border:none;cursor:pointer;color:var(--gray-500);transition:color 0.2s}.font-actions button:hover{color:var(--primary-color)}.category-sans-serif{background:#dbeafe;color:#1e40af}.category-serif{background:#fef3c7;color:#92400e}.category-monospace{background:#d1fae5;color:#065f46}.category-cursive{background:#fce7f3;color:#be185d}.category-fantasy{background:#e0e7ff;color:#3730a3}.load-more-fonts{text-align:center;margin:20px 0}.load-more-btn{background:var(--gray-100);border:1px solid var(--gray-300);padding:10px 30px;border-radius:40px;cursor:pointer;transition:all 0.2s}.load-more-btn:hover{background:var(--primary-color);color:white;border-color:var(--primary-color)}.info-tip{background:#fef3c7;border-radius:12px;padding:12px 16px;display:flex;align-items:center;gap:10px;font-size:0.85rem;color:#92400e}.info-tip kbd{background:#fff;padding:2px 8px;border-radius:6px;font-family:monospace;box-shadow:0 1px 2px rgba(0,0,0,0.1)}.font-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center;z-index:1000}.font-modal .modal-content{background:white;border-radius:24px;width:90%;max-width:550px;max-height:80vh;overflow:auto;animation:modalFadeIn 0.3s ease}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--gray-200)}.modal-header h3{display:flex;align-items:center;gap:8px}.modal-close{background:transparent;border:none;font-size:24px;cursor:pointer;color:var(--gray-500)}.modal-body{padding:24px}.font-detail-name{font-size:1.3rem;font-weight:600;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--gray-200)}.font-detail-preview{padding:30px;background:var(--gray-50);border-radius:16px;text-align:center;font-size:1.2rem;margin-bottom:20px}.font-detail-info{background:var(--gray-50);border-radius:12px;padding:16px}.info-row{display:flex;margin-bottom:12px;font-size:0.85rem}.info-row span{width:120px;color:var(--gray-600)}.info-row code{flex:1;word-break:break-all;color:var(--primary-color)}.modal-footer{display:flex;justify-content:flex-end;gap:12px;padding:16px 24px;border-top:1px solid var(--gray-200)}@keyframes modalFadeIn{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@media (max-width:768px){.stats-bar{grid-template-columns:1fr}.preview-settings{flex-direction:column;align-items:stretch}.font-list-header{display:none}.font-item{grid-template-columns:1fr;gap:8px}.font-category{width:fit-content}}