:root{--bg:#080b10;--bg-card:rgba(15, 20, 28, 0.6);--bg-glass:rgba(20, 28, 40, 0.4);--bg-hover:rgba(30, 42, 58, 0.5);--border:rgba(255, 255, 255, 0.06);--border-hover:rgba(34,211,238, 0.3);--text:#e4edf5;--text-dim:#7a8fa3;--accent:#22c55e;--accent-dim:rgba(34,211,238, 0.1);--green:#22c55e;--green-dim:rgba(34,211,238, 0.12);--red:#ef4444;--orange:#fbbf24;--orange-dim:rgba(251,191,36,0.12);--purple:#3388ff;--purple-dim:rgba(59,130,246, 0.12);--radius:14px;--radius-sm:8px;--sidebar-w:250px;--header-h:72px;--blur:blur(12px);--shadow:0 4px 24px rgba(0, 0, 0, 0.2);--transition:0.15s ease}body::after,body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;pointer-events:none;background:radial-gradient(circle at var(--mouse-x,30%) var(--mouse-y,30%),var(--accent),transparent 50%),radial-gradient(circle at calc(100% - var(--mouse-x,30%)) calc(100% - var(--mouse-y,30%)),var(--purple),transparent 50%);opacity:.04;transition:opacity .5s ease}body:hover::after,body:hover::before{opacity:.07}.search-box{position:relative;width:320px}.search-box input{width:100%;padding:9px 14px 9px 38px;background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);font-size:.85rem;transition:var(--transition)}.search-box input::placeholder{color:var(--text-dim)}.search-box input:focus{outline:0;border-color:var(--accent);background:var(--bg-hover)}.search-box i{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--text-dim);font-size:.85rem}.btn{display:inline-flex;gap:10px;align-items:center;padding:12px 22px;border-radius:12px;font-weight:600;font-size:.9rem;text-decoration:none;border:1px solid rgb(255 255 255 / .1);background:rgb(255 255 255 / .03);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--txt,var(--text,#f1f5f9));cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.btn::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgb(255 255 255 / .1) 0,transparent 50%);opacity:0;transition:opacity .3s}.btn:hover{border-color:rgba(34,211,238,.4);background:rgba(34,211,238,.08);color:var(--cyan,#22c55e);transform:translateY(-3px);box-shadow:0 12px 32px rgb(0 0 0 / .2),0 0 20px rgba(34,211,238,.1),inset 0 1px 0 rgb(255 255 255 / .1);text-decoration:none}.btn:hover::before{opacity:1}.btn:active{transform:translateY(-1px)}.btn-accent,.btn.primary{background:rgba(34,211,238,.12);border:1px solid rgba(34,211,238,.5);color:var(--cyan,#22c55e);font-weight:700;box-shadow:0 4px 16px rgba(34,211,238,.2)}.btn-accent::before,.btn.primary::before{background:linear-gradient(135deg,rgb(255 255 255 / .2) 0,transparent 60%)}.btn-accent:hover,.btn.primary:hover{background:rgba(34,211,238,.2);border-color:rgba(34,211,238,.8);color:var(--cyan,#22c55e);box-shadow:0 16px 40px rgba(34,211,238,.35),0 0 30px rgba(34,211,238,.2),inset 0 1px 0 rgb(255 255 255 / .3);transform:translateY(-3px)}.btn.ghost{background:#fff0;border-color:rgb(255 255 255 / .1);color:var(--txt,var(--text,#f1f5f9))}.btn.ghost:hover{background:rgba(34,211,238,.08);border-color:rgba(34,211,238,.3);color:var(--cyan,#22c55e)}.btn.pulse{animation:btnPulse 2.5s ease-in-out infinite}@keyframes btnPulse{0%,100%{box-shadow:0 4px 16px rgba(34,211,238,.2),0 0 0 0 rgba(34,211,238,.4)}50%{box-shadow:0 4px 16px rgba(34,211,238,.2),0 0 0 12px #fff0}}.app{display:flex;min-height:100vh;padding-top:var(--header-h)}.sidebar{position:fixed;top:var(--header-h);left:0;width:var(--sidebar-w);height:calc(100vh - var(--header-h));background:rgb(12 18 26 / .7);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-right:1px solid rgb(255 255 255 / .05);overflow-y:auto;padding:14px 0;z-index:100}.sidebar::-webkit-scrollbar{width:3px}.sidebar::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.sidebar-group{margin-bottom:6px}.sidebar-title{padding:8px 18px;font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim)}.sidebar-link{display:flex;align-items:center;gap:10px;padding:9px 18px;color:var(--text-dim);text-decoration:none;font-size:.85rem;font-weight:500;transition:var(--transition);border-left:2px solid #fff0}.sidebar-link:hover{color:var(--text);background:var(--bg-hover)}.sidebar-link.active{color:var(--accent);border-left-color:var(--accent);background:var(--accent-dim)}.sidebar-link i{width:16px;text-align:center;font-size:.9rem}.sidebar-link .num{margin-left:auto;font-size:.7rem;color:var(--text-dim);background:var(--bg-glass);padding:2px 7px;border-radius:5px}.main{flex:1;margin-left:var(--sidebar-w);padding:28px 36px;max-width:1300px}.hero{text-align:center;padding:50px 0 40px;margin-bottom:32px}.hero-tag{display:inline-flex;align-items:center;gap:8px;background:var(--accent-dim);border:1px solid rgba(34,211,238,.2);padding:5px 14px;border-radius:20px;font-size:.75rem;color:var(--accent);margin-bottom:18px}.hero-tag i{font-size:.7rem}.hero h1{font-size:clamp(2rem, 4vw, 3rem);font-weight:700;color:var(--text);margin-bottom:12px;letter-spacing:-.02em}.hero p{color:var(--text-dim);font-size:1.05rem;max-width:520px;margin:0 auto 28px}.hero-stats{display:flex;gap:40px;justify-content:center}.hero-stat{text-align:center}.hero-stat-value{font-size:2rem;font-weight:700;color:var(--accent);font-family:'JetBrains Mono',monospace}.hero-stat-label{font-size:.75rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em;margin-top:2px}.filters{display:flex;gap:10px;margin-bottom:28px;flex-wrap:wrap;align-items:center}.filter-pills{display:flex;gap:4px;background:var(--bg-glass);padding:4px;border-radius:var(--radius-sm);border:1px solid var(--border)}.filter-pill{padding:7px 12px;background:#fff0;border:none;color:var(--text-dim);font-size:.8rem;cursor:pointer;border-radius:6px;transition:var(--transition);display:flex;align-items:center;gap:5px}.filter-pill:hover{color:var(--text);background:var(--bg-hover)}.filter-pill.active{background:var(--accent);color:var(--bg)}.filter-select{padding:9px 14px;background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);font-size:.8rem;cursor:pointer}.filter-select:focus{outline:0;border-color:var(--accent)}.results-info{margin-left:auto;font-size:.85rem;color:var(--text-dim)}.results-info strong{color:var(--accent)}.category{margin-bottom:48px;scroll-margin-top:calc(var(--header-h) + 20px)}.category-head{display:flex;align-items:center;gap:14px;margin-bottom:18px;padding-bottom:12px;border-bottom:1px solid var(--border)}.category-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--bg-glass);border:1px solid var(--border);border-radius:10px;font-size:1.1rem}.category-icon.cyan{color:var(--accent);background:var(--accent-dim);border-color:rgba(34,211,238,.2)}.category-icon.green{color:var(--accent);background:var(--accent-dim);border-color:rgba(34,211,238,.2)}.category-info{flex:1}.category-title{font-size:1.25rem;font-weight:700;margin-bottom:2px}.category-desc{font-size:.85rem;color:var(--text-dim)}.tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px}.tool-card{background:var(--bg-card);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border:1px solid var(--border);border-radius:var(--radius);padding:16px;transition:var(--transition);display:flex;flex-direction:column}.tool-card:hover{border-color:var(--border-hover);transform:translateY(-2px);box-shadow:var(--shadow)}.tool-top{display:flex;align-items:flex-start;gap:10px;margin-bottom:10px}.tool-icon{width:36px;height:36px;background:var(--bg-glass);border:1px solid var(--border);border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--accent);flex-shrink:0}.tool-icon img{width:24px;height:24px;object-fit:contain;border-radius:3px;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}.tool-info{flex:1;min-width:0}.tool-name{font-size:.95rem;font-weight:600;margin-bottom:2px;display:flex;align-items:center;gap:6px}.tool-name .oss{color:var(--cyan);font-size:.8rem}.tool-meta{font-size:.7rem;color:var(--text-dim);display:flex;align-items:center;gap:8px}.tool-meta .stars{color:var(--orange);display:flex;align-items:center;gap:3px}.tool-actions{display:flex;gap:4px}.tool-action{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:var(--bg-glass);border:1px solid var(--border);border-radius:6px;color:var(--text-dim);font-size:.8rem;cursor:pointer;transition:var(--transition)}.tool-action:hover{border-color:var(--accent);color:var(--accent)}.tool-action.saved{background:rgba(239,68,68,.15);border-color:var(--red);color:var(--red)}.tool-desc{font-size:.8rem;color:var(--text-dim);line-height:1.5;margin-bottom:12px;flex-grow:1}.tool-tags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:12px}.tag{padding:3px 8px;background:var(--bg-glass);border-radius:5px;font-size:.65rem;color:var(--text-dim);font-weight:500}.tag.open-source{background:var(--accent-dim);color:var(--accent)}.tag.free{background:var(--accent-dim);color:var(--accent)}.tag.paid{background:var(--orange-dim);color:var(--orange)}.tag.freemium{background:var(--purple-dim);color:var(--purple)}.tool-platforms{display:flex;gap:5px;margin-bottom:12px}.platform{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:var(--bg-glass);border-radius:5px;font-size:.75rem;color:var(--text-dim)}.platform.on{background:var(--accent-dim);color:var(--accent)}.tool-links{display:flex;gap:6px;margin-top:auto}.tool-link{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 14px;background:rgb(255 255 255 / .03);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgb(255 255 255 / .08);border-radius:10px;color:var(--text);text-decoration:none;font-size:.8rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1)}.tool-link:hover{border-color:rgba(34,211,238,.4);background:rgba(34,211,238,.08);color:var(--accent);transform:translateY(-2px);box-shadow:0 8px 24px rgb(0 0 0 / .15),0 0 16px rgba(34,211,238,.1)}.tool-link.primary{background:rgba(34,211,238,.1);border-color:rgba(34,211,238,.3);color:var(--accent)}.tool-link.primary:hover{background:rgba(34,211,238,.18);border-color:rgba(34,211,238,.5);box-shadow:0 8px 24px rgba(0,0,0,.15),0 0 20px rgba(34,211,238,.15)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgb(0 0 0 / .7);backdrop-filter:blur(12px);z-index:2000;display:none;align-items:center;justify-content:center;padding:20px}.modal-overlay.active{display:flex}.modal{background:var(--bg-card);backdrop-filter:var(--blur);border:1px solid var(--border);border-radius:var(--radius);max-width:500px;width:100%;max-height:70vh;overflow:hidden}.modal-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border)}.modal-head h2{font-size:1rem;display:flex;align-items:center;gap:8px}.modal-close{width:30px;height:30px;display:flex;align-items:center;justify-content:center;background:var(--bg-glass);border:none;border-radius:6px;color:var(--text-dim);cursor:pointer}.modal-close:hover{background:var(--red);color:#fff}.modal-body{padding:20px;overflow-y:auto;max-height:50vh}.saved-empty{text-align:center;color:var(--text-dim);padding:36px 0}.saved-empty i{font-size:2rem;margin-bottom:12px;opacity:.3}.saved-item{display:flex;align-items:center;gap:10px;padding:10px;background:var(--bg-glass);border-radius:var(--radius-sm);margin-bottom:8px}.saved-item-info{flex:1}.saved-item-name{font-weight:600;font-size:.9rem}.saved-item-cat{font-size:.7rem;color:var(--text-dim)}.saved-item-rm{width:26px;height:26px;display:flex;align-items:center;justify-content:center;background:rgba(239,68,68,.15);border:none;border-radius:5px;color:var(--red);cursor:pointer}.saved-item-rm:hover{background:var(--red);color:#fff}.scroll-top{position:fixed;bottom:24px;right:24px;width:42px;height:42px;background:var(--accent);border:none;border-radius:50%;color:var(--bg);font-size:1rem;cursor:pointer;opacity:0;visibility:hidden;transition:var(--transition);z-index:900}.scroll-top.visible{opacity:1;visibility:visible}.scroll-top:hover{transform:translateY(-3px);box-shadow:0 6px 20px rgba(34,211,238,.3)}@media (max-width:960px){.sidebar{left:-100%;transition:left .2s}.sidebar.active{left:0}.main{margin-left:0;padding:20px}.pd-site-footer{margin-left:0!important}.search-box{width:100%;max-width:260px}#menuBtn{display:inline-flex!important}}@media (max-width:768px){.sidebar,[class*=sidebar]{width:100%!important;position:static!important;height:auto!important}}@media (max-width:600px){.search-box{display:none}.filters{flex-direction:column;align-items:stretch}.results-info{margin-left:0;text-align:center}.hero{padding:32px 0 28px}.hero h1{font-size:1.7rem}.tools-grid{grid-template-columns:1fr}.hero-stats{gap:24px}}.snowflake-callout{margin-top:20px;padding:20px 24px;background:var(--bg-card);border:1px solid rgba(34,211,238,.15);border-radius:var(--radius);display:flex;gap:24px;align-items:center;flex-wrap:wrap}.snowflake-callout-info{flex:1;min-width:200px}.snowflake-callout-title{display:flex;align-items:center;gap:10px;font-size:.95rem;font-weight:700;color:var(--text);margin-bottom:8px}.snowflake-callout-title i{color:var(--accent);font-size:1.1rem}.snowflake-callout-desc{font-size:.82rem;color:var(--text-dim);line-height:1.65;margin:0}.snowflake-callout-desc strong{color:var(--text)}.snowflake-callout-desc a{color:var(--accent);text-decoration:none}.snowflake-callout-desc a:hover{text-decoration:underline}.snowflake-callout-frame{flex-shrink:0;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--border)}@media(max-width:640px){.snowflake-callout{flex-direction:column}.snowflake-callout-frame{width:100%}.snowflake-callout-frame iframe{width:100%;max-width:320px;display:block}}

/* ─── Premium polish — cards · sidebar · mobile (2026-06-26) ─── */
.tool-card{background:linear-gradient(160deg,rgba(24,32,45,.62),rgba(12,17,25,.62));box-shadow:inset 0 1px 0 rgba(255,255,255,.04);transition:transform .25s cubic-bezier(.4,0,.2,1),border-color .25s ease,box-shadow .25s ease,background .25s ease}
.tool-card:hover{border-color:rgba(34,211,238,.32);transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.4),0 0 0 1px rgba(34,211,238,.1),0 0 26px rgba(34,211,238,.08),inset 0 1px 0 rgba(255,255,255,.06)}
.tool-icon{background:linear-gradient(135deg,rgba(34,211,238,.14),rgba(51,136,255,.05));border-color:rgba(255,255,255,.09);box-shadow:inset 0 1px 0 rgba(255,255,255,.07);transition:border-color .25s ease,box-shadow .25s ease}
.tool-card:hover .tool-icon{border-color:rgba(34,211,238,.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 14px rgba(34,211,238,.14)}
.tool-name{letter-spacing:-.01em}
.tag{text-transform:uppercase;letter-spacing:.04em;font-size:.62rem;padding:3px 9px;border:1px solid rgba(255,255,255,.05)}
.tag.open-source,.tag.free{border-color:rgba(34,211,238,.2)}
.tag.paid{border-color:rgba(251,191,36,.2)}
.tag.freemium{border-color:rgba(51,136,255,.2)}
.tool-action{transition:border-color .2s ease,color .2s ease,background .2s ease,transform .2s ease}
.tool-action:hover{transform:translateY(-1px)}
.tool-link{transition:transform .25s cubic-bezier(.4,0,.2,1),border-color .25s ease,box-shadow .25s ease,background .25s ease,color .25s ease}
.category-icon{box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.category-title{letter-spacing:-.01em}
.sidebar-link{border-left:0;border-radius:0 9px 9px 0;margin:1px 10px 1px 0;padding:9px 16px;transition:color .2s ease,background .2s ease,transform .2s ease}
.sidebar-link:hover{transform:translateX(3px);background:rgba(255,255,255,.04)}
.sidebar-link.active{background:linear-gradient(90deg,rgba(34,211,238,.16),rgba(34,211,238,.02));box-shadow:inset 3px 0 0 var(--accent);color:var(--accent)}
.sidebar-link.active i{color:var(--accent)}
.sidebar-link .num{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.06);min-width:22px;text-align:center;font-weight:600}
.sidebar-link.active .num{background:var(--accent-dim);color:var(--accent);border-color:rgba(34,211,238,.25)}
.scroll-top{width:44px;height:44px;box-shadow:0 6px 20px rgba(0,0,0,.35),0 0 0 1px rgba(34,211,238,.2)}
.pa-topbar{background:rgb(9 13 19 / .9)!important;box-shadow:0 2px 14px rgba(0,0,0,.3)}
@media(max-width:960px){.pa-topbar{background:rgb(7 10 15 / .97)!important}}
@media(max-width:600px){.tool-card{padding:15px}.tool-card:hover{transform:none}.main{padding:18px 14px}.category{margin-bottom:34px}}