@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";:root{--bg-main:#faf9f7;--bg-card:#fff;--bg-elevated:#f5f3f0;--bg-input:#fff;--border-main:#e8e5e1;--border-hover:#d4d0cb;--text-primary:#1a1a1a;--text-secondary:#5c5c5c;--text-tertiary:#8a8a8a;--accent:#c45d3e;--accent-hover:#b04e32;--accent-soft:#c45d3e14;--accent-border:#c45d3e33;--blue:#2563eb;--blue-soft:#2563eb12;--blue-border:#2563eb2e;--green:#16a34a;--green-soft:#16a34a12;--green-border:#16a34a2e;--purple:#7c3aed;--purple-soft:#7c3aed12;--purple-border:#7c3aed2e;--shadow-sm:0 1px 3px #0000000a, 0 1px 2px #00000005;--shadow-md:0 4px 12px #0000000f;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-full:9999px;--font-body:"DM Sans", system-ui, -apple-system, sans-serif;--font-heading:"Space Grotesk", var(--font-body);--font-mono:"JetBrains Mono", monospace;--transition:.2s ease}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-main);color:var(--text-primary);font-family:var(--font-body);-webkit-font-smoothing:antialiased;min-height:100vh;line-height:1.6}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);letter-spacing:-.025em}a{color:inherit;text-decoration:none}.app-container{flex-direction:column;min-height:100vh;display:flex}.main-content{flex:1;width:100%;max-width:1100px;margin:0 auto;padding:1.25rem}@media (width>=768px){.main-content{padding:2rem}}.navbar{z-index:50;-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border-main);background:#faf9f7eb;position:sticky;top:0}.navbar-inner{justify-content:space-between;align-items:center;gap:.75rem;max-width:1100px;margin:0 auto;padding:.7rem 1.25rem;display:flex}.brand-logo{color:var(--text-primary);font-family:var(--font-heading);cursor:pointer;-webkit-user-select:none;user-select:none;flex-shrink:0;align-items:center;gap:.5rem;font-size:1.1rem;font-weight:700;text-decoration:none;display:flex}.brand-heart{background:var(--accent-soft);width:28px;height:28px;color:var(--accent);border:1px solid var(--accent-border);border-radius:6px;justify-content:center;align-items:center;display:inline-flex}.nav-categories{-webkit-overflow-scrolling:touch;scrollbar-width:none;align-items:center;gap:.35rem;display:flex;overflow-x:auto}.nav-categories::-webkit-scrollbar{display:none}.cat-pill{border-radius:var(--radius-full);cursor:pointer;transition:var(--transition);white-space:nowrap;font-size:.78rem;font-weight:600;font-family:var(--font-body);background:0 0;border:1px solid #0000;align-items:center;gap:.35rem;padding:.35rem .75rem;display:inline-flex}.cat-pill:hover{transform:translateY(-1px)}.cat-pill.cat-pdf{color:var(--blue)}.cat-pill.cat-pdf:hover,.cat-pill.cat-pdf.active{background:var(--blue-soft);border-color:var(--blue-border)}.cat-pill.cat-image{color:var(--green)}.cat-pill.cat-image:hover,.cat-pill.cat-image.active{background:var(--green-soft);border-color:var(--green-border)}.cat-pill.cat-other{color:var(--purple)}.cat-pill.cat-other:hover,.cat-pill.cat-other.active{background:var(--purple-soft);border-color:var(--purple-border)}.btn{border-radius:var(--radius-sm);font-family:var(--font-body);cursor:pointer;transition:var(--transition);white-space:nowrap;border:1px solid #0000;outline:none;justify-content:center;align-items:center;gap:.4rem;padding:.5rem 1rem;font-size:.88rem;font-weight:600;display:inline-flex}.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent)}.btn-primary:hover{background:var(--accent-hover)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-secondary{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border-main)}.btn-secondary:hover{background:var(--bg-elevated);border-color:var(--border-hover)}.btn-sm{padding:.35rem .65rem;font-size:.8rem}.btn-blue{background:var(--blue);color:#fff}.btn-blue:hover{background:#1d4ed8}.btn-green{background:var(--green);color:#fff}.btn-green:hover{background:#15803d}.hero-section{text-align:center;max-width:680px;margin:0 auto;padding:2.5rem 1rem 1.5rem}.hero-pill{border-radius:var(--radius-full);background:var(--green-soft);border:1px solid var(--green-border);color:var(--green);align-items:center;gap:.4rem;margin-bottom:1rem;padding:.25rem .75rem;font-size:.75rem;font-weight:600;display:inline-flex}.hero-title{margin-bottom:.75rem;font-size:1.85rem;font-weight:700;line-height:1.2}.hero-title .accent-word{color:var(--accent)}@media (width>=768px){.hero-title{font-size:2.5rem}}.hero-subtitle{color:var(--text-secondary);max-width:540px;margin:0 auto 1.5rem;font-size:.95rem;line-height:1.65}.category-tabs{border-bottom:1px dashed var(--border-main);flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;margin-bottom:1.5rem;padding:.85rem 0;display:flex}.category-tab{border-radius:var(--radius-md);cursor:pointer;transition:var(--transition);background:var(--bg-card);font-size:.88rem;font-weight:600;font-family:var(--font-body);border:1px solid #0000;align-items:center;gap:.45rem;padding:.55rem 1.1rem;display:inline-flex}.category-tab:hover{transform:translateY(-1px)}.category-tab.tab-pdf{color:var(--blue);background:var(--blue-soft);border-color:var(--blue-border)}.category-tab.tab-image{color:var(--green);background:var(--green-soft);border-color:var(--green-border)}.category-tab.tab-text{color:var(--purple);background:var(--purple-soft);border-color:var(--purple-border)}.category-tab.tab-security{color:#dc2626;background:#dc262614;border-color:#dc262633}.category-tab.tab-media{color:#d97706;background:#d9770614;border-color:#d9770633}.category-tab.tab-other{color:var(--purple);background:var(--purple-soft);border-color:var(--purple-border)}.category-hero{text-align:center;padding:2rem 1rem 1.5rem}.category-icon-wrap{border-radius:var(--radius-md);justify-content:center;align-items:center;width:56px;height:56px;margin-bottom:.75rem;display:inline-flex}.category-icon-wrap.ci-pdf{background:var(--blue-soft);color:var(--blue);border:1px solid var(--blue-border)}.category-icon-wrap.ci-image{background:var(--green-soft);color:var(--green);border:1px solid var(--green-border)}.category-icon-wrap.ci-text{background:var(--purple-soft);color:var(--purple);border:1px solid var(--purple-border)}.category-icon-wrap.ci-security{color:#dc2626;background:#dc262614;border:1px solid #dc262633}.category-icon-wrap.ci-media{color:#d97706;background:#d9770614;border:1px solid #d9770633}.category-icon-wrap.ci-other{background:var(--purple-soft);color:var(--purple);border:1px solid var(--purple-border)}.tools-grid{grid-template-columns:1fr;gap:.85rem;margin:1.25rem 0;display:grid}@media (width>=520px){.tools-grid{grid-template-columns:repeat(2,1fr)}}@media (width>=840px){.tools-grid{grid-template-columns:repeat(3,1fr)}}.tool-card{background:var(--bg-card);border:1px solid var(--border-main);border-radius:var(--radius-lg);transition:var(--transition);cursor:pointer;box-shadow:var(--shadow-sm);flex-direction:column;padding:1.25rem;display:flex}.tool-card:hover{border-color:var(--border-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.tool-card-top{justify-content:space-between;align-items:flex-start;margin-bottom:.85rem;display:flex}.tool-icon-wrapper{border-radius:var(--radius-md);flex-shrink:0;justify-content:center;align-items:center;width:42px;height:42px;line-height:1;display:inline-flex}.tool-icon-wrapper svg{display:block}.tool-icon-wrapper.ti-pdf{background:var(--blue-soft);color:var(--blue);border:1px solid var(--blue-border)}.tool-icon-wrapper.ti-image{background:var(--green-soft);color:var(--green);border:1px solid var(--green-border)}.tool-icon-wrapper.ti-text{background:var(--purple-soft);color:var(--purple);border:1px solid var(--purple-border)}.tool-icon-wrapper.ti-security{color:#dc2626;background:#dc262614;border:1px solid #dc262633}.tool-icon-wrapper.ti-media{color:#d97706;background:#d9770614;border:1px solid #d9770633}.tool-icon-wrapper.ti-other{background:var(--purple-soft);color:var(--purple);border:1px solid var(--purple-border)}.tool-title{margin-bottom:.2rem;font-size:1rem;font-weight:700}.tool-desc{color:var(--text-secondary);font-size:.82rem;line-height:1.5}.tool-workspace{background:var(--bg-card);border:1px solid var(--border-main);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin:1rem 0 2rem;padding:1.5rem}.tool-header-bar{border-bottom:1px solid var(--border-main);justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.85rem;display:flex}.back-btn{color:var(--text-secondary);cursor:pointer;transition:var(--transition);font-size:.85rem;font-weight:600;font-family:var(--font-body);background:0 0;border:none;align-items:center;gap:.3rem;display:inline-flex}.back-btn:hover{color:var(--text-primary)}.dropzone{border:2px dashed var(--border-hover);background:var(--bg-elevated);border-radius:var(--radius-md);text-align:center;cursor:pointer;transition:var(--transition);flex-direction:column;align-items:center;gap:.5rem;padding:2.25rem 1.25rem;display:flex}.dropzone:hover,.dropzone.active{border-color:var(--accent);background:var(--accent-soft)}.dropzone-icon{background:var(--accent-soft);width:44px;height:44px;color:var(--accent);border-radius:50%;justify-content:center;align-items:center;display:flex}.dropzone-title{font-size:1rem;font-weight:700}.dropzone-subtitle{color:var(--text-tertiary);font-size:.8rem}.control-group{margin-bottom:1rem}.control-label{justify-content:space-between;align-items:center;margin-bottom:.35rem;font-size:.82rem;font-weight:600;display:flex}.custom-slider{background:var(--border-main);-webkit-appearance:none;width:100%;height:5px;accent-color:var(--accent);border-radius:3px;outline:none}.search-input,.form-input{border-radius:var(--radius-sm);background:var(--bg-card);border:1px solid var(--border-main);width:100%;color:var(--text-primary);font-size:.85rem;font-family:var(--font-body);transition:var(--transition);outline:none;padding:.5rem .8rem}.search-input::placeholder,.form-input::placeholder{color:var(--text-tertiary)}.search-input:focus,.form-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}select.search-input,select.form-input{cursor:pointer}.code-box{border-radius:var(--radius-sm);font-family:var(--font-mono);color:#d4d4d4;background:#1e1e1e;border:1px solid #333;max-height:380px;padding:1rem;font-size:.8rem;overflow-x:auto}.ad-banner-slot{border-radius:var(--radius-sm);background:var(--bg-elevated);border:1px dashed var(--border-main);text-align:center;flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:70px;margin:1.25rem 0;padding:.75rem;display:flex}.ad-label{color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.2rem;font-size:.58rem;font-weight:700}.ad-content-placeholder{color:var(--text-tertiary);font-size:.75rem}.footer{border-top:1px solid var(--border-main);background:var(--bg-card);margin-top:2.5rem;padding:2.5rem 1.25rem 1.5rem}.footer-inner{grid-template-columns:1fr;gap:1.5rem;max-width:1200px;margin:0 auto;display:grid}@media (width>=580px) and (width<=899px){.footer-inner{grid-template-columns:repeat(3,1fr);gap:1.5rem}}@media (width>=900px){.footer-inner{grid-template-columns:1.5fr repeat(6,1fr);gap:1.15rem}}.footer-brand-desc{color:var(--text-secondary);max-width:280px;margin-top:.5rem;font-size:.82rem;line-height:1.55}.footer-heading{text-transform:uppercase;letter-spacing:.06em;margin-bottom:.75rem;font-size:.72rem;font-weight:700}.footer-heading.fh-pdf{color:var(--blue)}.footer-heading.fh-image{color:var(--green)}.footer-heading.fh-other{color:var(--purple)}.footer-links{flex-direction:column;gap:.4rem;list-style:none;display:flex}.footer-link{color:var(--text-secondary);transition:var(--transition);cursor:pointer;font-size:.82rem}.footer-link:hover{color:var(--text-primary)}.footer-bottom{border-top:1px solid var(--border-main);max-width:1200px;color:var(--text-tertiary);flex-direction:column;justify-content:space-between;align-items:center;gap:.5rem;margin:2rem auto 0;padding-top:1.15rem;font-size:.75rem;display:flex}@media (width>=640px){.footer-bottom{flex-direction:row}}.hide-mobile{display:none}@media (width>=640px){.hide-mobile{display:inline-flex}}.crop-canvas-wrap{border:1px solid var(--border-main);border-radius:var(--radius-sm);max-width:100%;display:inline-block;position:relative;overflow:hidden}