:root{--bg:#FFFFFF;--accent:#6b09f3;--accent-light:rgba(107, 9, 243, 0.08);--accent-hover:#5a07cc;--text:#111111;--text-secondary:#666666;--border:#eeeeee;--surface:#f8f8fb;--radius:10px;--radius-sm:8px;--shadow:0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.06);--shadow-md:0 4px 12px rgba(0, 0, 0, 0.06);--shadow-lg:0 8px 24px rgba(0, 0, 0, 0.08);--transition:0.2s ease;--max-width:900px}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100vh}button{cursor:pointer;border:none;background:none;font:inherit;color:inherit}input{border:none;outline:none;font:inherit}.ad-slot{display:flex;align-items:center;justify-content:center;background:var(--surface);border-bottom:1px solid var(--border);color:var(--text-secondary);font-size:11px;letter-spacing:.5px;text-transform:uppercase}.ad-slot--top{height:90px}.ad-slot--bottom{height:250px;border-top:1px solid var(--border);border-bottom:none}.ad-slot__label{opacity:.5}.input-section{position:sticky;top:0;z-index:100;background:var(--bg);transition:box-shadow var(--transition)}.input-section.is-stuck{box-shadow:0 2px 12px rgb(0 0 0 / .06)}.input-section__inner{max-width:var(--max-width);margin:0 auto;padding:32px 20px 20px}.main-heading{text-align:center;font-size:28px;font-weight:700;letter-spacing:-.5px;margin-bottom:20px;color:var(--text)}.input-wrap{position:relative}.main-input{width:100%;padding:16px 20px;font-size:18px;border:2px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);transition:border-color var(--transition),box-shadow var(--transition)}.main-input::placeholder{color:#bbb}.main-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}.input-subtitle{text-align:center;font-size:13px;color:var(--text-secondary);margin-top:10px}#stickySentinel{height:1px;margin-top:-1px}.preview-section{max-width:var(--max-width);margin:0 auto;padding:0 20px}.preview-section__inner{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;margin-bottom:8px}.preview-toggle{display:none;width:100%;padding:12px 16px;justify-content:space-between;align-items:center;font-size:14px;font-weight:600;color:var(--text)}.preview-toggle__icon{transition:transform var(--transition)}.preview-toggle[aria-expanded="false"] .preview-toggle__icon{transform:rotate(-90deg)}.preview-body{max-height:300px;overflow:hidden;transition:max-height 0.3s ease}.preview-body.is-collapsed{max-height:0}.preview-tabs{display:flex;gap:0;border-bottom:1px solid var(--border);background:#fff}.preview-tab{flex:1;padding:10px 8px;font-size:12px;font-weight:600;color:var(--text-secondary)!important;text-align:center;border-bottom:2px solid #fff0;transition:color var(--transition),border-color var(--transition),background-color var(--transition);white-space:nowrap;background-color:#ffffff!important;box-shadow:none!important;border:none}.preview-tab:hover{color:var(--text)!important}.preview-tab.active{color:#ffffff!important;background:linear-gradient(90deg,#6b09f3,#8f3bff)!important;border-bottom-color:transparent!important}.platform-mockup{display:none}.platform-mockup.active{display:block}.bio-mockup{padding:14px 16px;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif}.bio-mockup__avatar{border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}.bio-mockup__name{font-weight:600;font-size:14px;color:#fff}.bio-mockup__bio{font-size:14px;line-height:1.5;word-break:break-word;margin-top:4px;min-height:20px;color:#e1e1e1}.bio-mockup--ig{background:#121212;border-radius:8px}.bio-mockup__header{display:flex;align-items:center;gap:16px;margin-bottom:10px}.bio-mockup__avatar--ig{width:50px;height:50px;background:linear-gradient(135deg,#f58529,#dd2a7b,#8134af);padding:2px}.bio-mockup__avatar--ig svg{background:#121212;border-radius:50%}.bio-mockup__stats{display:flex;gap:16px;flex:1}.bio-mockup__stat{display:flex;flex-direction:column;align-items:center;font-size:12px;color:#aaa}.bio-mockup__stat strong{font-size:15px;color:#fff}.bio-mockup--tt{background:#000;border-radius:8px;text-align:center;padding:16px}.bio-mockup__avatar--tt{width:52px;height:52px;background:#333;margin:0 auto 8px}.bio-mockup__name--tt{color:#fff;font-size:16px;margin-bottom:4px}.bio-mockup__tt-stats{display:flex;justify-content:center;gap:16px;font-size:12px;color:#aaa;margin-bottom:10px}.bio-mockup__tt-stats strong{color:#fff;font-size:14px}.bio-mockup__bio--tt{color:#e1e1e1;text-align:center;font-size:13px}.bio-mockup--wa{background:#1f2c34;border-radius:8px}.bio-mockup__wa-row{display:flex;align-items:center;gap:14px}.bio-mockup__avatar--wa{width:52px;height:52px;background:#25d366}.bio-mockup__name--wa{font-size:16px;color:#e9edef}.bio-mockup__bio--wa{color:#8696a0;font-size:13px}.bio-mockup--fb{background:#18191a;border-radius:8px;text-align:center}.bio-mockup__fb-header{margin-bottom:8px}.bio-mockup__avatar--fb{width:56px;height:56px;background:#1877f2;margin:0 auto}.bio-mockup__name--fb{font-size:18px;font-weight:700;margin-bottom:2px;color:#e4e6eb}.bio-mockup__bio--fb{color:#b0b3b8;font-size:14px}.category-nav{display:flex;align-items:center;gap:8px;width:100%;max-width:var(--max-width);margin:8px auto 0;padding:0 20px;box-sizing:border-box}.category-nav__arrow{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;color:var(--text-secondary);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);transition:color var(--transition),background var(--transition),border-color var(--transition)}.category-nav__arrow:hover:not(:disabled){color:var(--accent);background:var(--accent-light);border-color:var(--accent)}.category-nav__arrow:disabled{opacity:.4;cursor:not-allowed}.category-nav__inner{flex:1;min-width:0;display:flex;flex-wrap:nowrap;gap:8px;padding:8px 0 12px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.category-nav__inner::-webkit-scrollbar{display:none}.category-nav__btn{flex-shrink:0;padding:7px 14px;font-size:12px;font-weight:600;color:var(--text-secondary);background:var(--surface);border:1px solid var(--border);border-radius:20px;transition:all var(--transition);white-space:nowrap}.category-nav__btn:hover{color:var(--accent);border-color:var(--accent)}.category-nav__btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}.collapsible-section{margin-bottom:16px}.collapsible-header{display:flex;align-items:center;width:100%;padding:14px 16px;background:var(--surface)!important;border:1px solid var(--border)!important;border-radius:var(--radius);gap:10px;transition:background var(--transition),color var(--transition),border-color var(--transition)}.collapsible-header:hover{background:#f0f0f5}.collapsible-header__title{font-size:16px;font-weight:700;color:var(--text)!important}.collapsible-header__hint{flex:1;font-size:12px;color:var(--text-secondary)!important;text-align:right}.collapsible-header__icon{flex-shrink:0;transition:transform 0.3s ease}.collapsible-header[aria-expanded="true"] .collapsible-header__icon{transform:rotate(180deg)}.collapsible-header[aria-expanded="true"] .collapsible-header__hint{display:none}.collapsible-body{max-height:0;overflow:hidden;transition:max-height 0.4s ease}.collapsible-body__inner{padding-top:12px}.main-content{max-width:var(--max-width);margin:0 auto;padding:24px 20px 40px}.section-title{font-size:18px;font-weight:700;margin-bottom:16px;color:var(--text)}.font-grid{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:12px}.font-card{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow);transition:transform var(--transition),box-shadow var(--transition);position:relative}.font-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.font-card__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.font-card__category{font-size:11px;font-weight:600;color:var(--accent);text-transform:uppercase;letter-spacing:.5px}.font-card__fav{width:28px;height:28px;display:flex;align-items:center;justify-content:center;font-size:16px;border-radius:50%;transition:background var(--transition);flex-shrink:0}.font-card__fav:hover{background:var(--accent-light)}.font-card__fav.is-fav{color:var(--accent)}.font-card__preview{font-size:20px;line-height:1.5;margin-bottom:12px;word-break:break-word;min-height:32px;color:var(--text)}.font-card__footer{display:flex;align-items:center;justify-content:space-between;gap:8px}.font-card__compat{display:flex;gap:6px;flex-wrap:wrap}.font-card__compat-badge{font-size:10px;color:var(--text-secondary);background:var(--surface);padding:2px 6px;border-radius:4px;white-space:nowrap}.font-card__copy{padding:8px 16px;font-size:13px;font-weight:600;color:#fff;background:var(--accent);border-radius:var(--radius-sm);transition:background var(--transition),transform 0.1s ease;white-space:nowrap;flex-shrink:0}.font-card__copy:hover{background:var(--accent-hover)}.font-card__copy:active{transform:scale(.96)}.font-card__copy.is-copied{background:#16a34a}.category-section{margin-top:24px}.category-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);font-size:16px;font-weight:700;color:var(--text);width:100%;transition:background var(--transition)}.category-header:hover{background:#f0f0f5}.category-header__icon{transition:transform 0.3s ease;flex-shrink:0}.category-header[aria-expanded="true"] .category-header__icon{transform:rotate(180deg)}.category-body{max-height:0;overflow:hidden;transition:max-height 0.4s ease}.category-body__inner{padding-top:12px}.load-more-wrap{text-align:center;margin:24px 0}.load-more-btn{padding:12px 32px;font-size:14px;font-weight:600;color:var(--accent);border:2px solid var(--accent);border-radius:var(--radius);transition:background var(--transition),color var(--transition)}.load-more-btn:hover{background:var(--accent);color:#fff}.font-section{margin-bottom:24px}.back-to-top{position:fixed;bottom:24px;right:24px;width:44px;height:44px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity 0.3s ease,visibility 0.3s ease,transform 0.3s ease;z-index:90}.back-to-top.is-visible{opacity:1;visibility:visible;transform:translateY(0)}.back-to-top:hover{background:var(--accent-hover)}.toast-container{position:fixed;bottom:80px;left:50%;transform:translateX(-50%);z-index:200;display:flex;flex-direction:column;gap:8px;pointer-events:none}.toast{background:var(--text);color:#fff;padding:10px 20px;border-radius:var(--radius-sm);font-size:14px;font-weight:600;box-shadow:var(--shadow-lg);animation:toastIn 0.3s ease forwards;white-space:nowrap}.toast.is-out{animation:toastOut 0.25s ease forwards}@keyframes toastIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes toastOut{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-10px)}}@media (min-width:560px){.font-grid{grid-template-columns:repeat(2,1fr)}.main-heading{font-size:32px}.main-input{font-size:20px;padding:18px 24px}}@media (min-width:840px){.font-grid{grid-template-columns:repeat(3,1fr)}}@media (max-width:559px){.preview-toggle{display:flex}.input-section__inner{padding:20px 16px 14px}.main-heading{font-size:24px;margin-bottom:14px}.font-card__preview{font-size:18px}.preview-tab{font-size:11px;padding:8px 4px}}