:root{--accent:#6657ff;--bg:#f8f8f9;--text:#454955;--muted:#90949f;--side:218px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:70px}body{margin:0;font:13px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;background:var(--bg);color:var(--text)}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}aside{position:fixed;inset:0 auto 0 0;width:var(--side);background:#fafafb;z-index:30;overflow:auto;scrollbar-width:thin;transition:transform .2s}.brand{height:76px;display:flex;align-items:center;justify-content:center;gap:5px;font-size:25px;font-weight:900;font-style:italic;letter-spacing:1px;color:#19202e;background:#fff;white-space:nowrap}.brand em{color:var(--accent);font-style:normal;text-shadow:1px 1px #c3b4ff}nav{padding:0 0 20px}.nav-parent{display:flex;align-items:center;width:100%;padding:13px 19px;gap:12px;border:0;background:none;color:#747d8c;text-align:left;font-size:13px}.nav-parent:hover,.nav-parent.active{background:#efedf8;color:var(--accent)}.nav-icon{width:22px;font-size:22px;line-height:1;color:#606b7c;text-align:center}.chevron{margin-left:auto;font-size:20px;transition:transform .2s}.chevron.open{transform:rotate(90deg)}.subnav{background:#f0f0f4;padding:7px 0}.subnav[hidden]{display:none}.subnav button{display:block;text-align:left;width:100%;padding:8px 15px 8px 52px;background:none;border:0;color:#7c8290;font-size:12px}.subnav button:hover,.subnav button.active{color:var(--accent);background:#e8e5fc}.side-submit{margin:8px 22px 25px;border:1px solid #e6e6ec;background:white;border-radius:5px;padding:8px 20px;color:#7d8391}main{margin-left:var(--side);transition:margin-left .2s}header{height:64px;display:flex;align-items:center;gap:26px;padding:0 24px;position:absolute;top:0;left:var(--side);right:0;z-index:10;color:#515965;font-size:12px}header button{border:0;background:none;padding:0;color:inherit;white-space:nowrap}#menu-toggle{font-size:20px;color:#7c8591}#saved{margin-left:auto;font-size:11px}#count{margin-left:3px;color:var(--accent)}.hero{height:285px;padding-top:76px;text-align:center;background:radial-gradient(ellipse at 20% 0,#edf3f7,transparent 65%),radial-gradient(ellipse at 80% 0,#f5eef5,transparent 65%)}h1{font-size:40px;line-height:1.3;color:#6d3ee8;letter-spacing:1px;font-weight:650;margin:4px 0 24px;text-shadow:1px 2px 1px #c0a7f2}h1 em{font-style:normal}.search-modes{display:flex;justify-content:center;gap:32px;margin-bottom:8px}.search-modes button{background:none;border:0;color:#999ba3;font-size:13px;position:relative;padding:0 0 5px}.search-modes button.active{color:#5e626c}.search-modes button.active:after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:#7e8390;border-radius:3px}form{display:flex;align-items:center;max-width:790px;margin:0 auto;border-radius:40px;background:#cacaca;height:48px;padding:0 14px 0 20px}#search{background:none;border:0;outline:none;min-width:0;flex:1;color:white;font-size:15px}#search::placeholder{color:#96999d}form:focus-within{box-shadow:0 0 0 3px #6657ff22}form button{background:none;border:0;color:#fff;font-weight:700;font-size:31px;line-height:1}#search-options{font-size:10px;color:#9093a0;height:18px;margin-top:5px}.content{max-width:1990px;margin:0 auto;padding:24px clamp(24px,4.5vw,115px) 0}.recommend{display:flex;gap:8px;background:#fff;box-shadow:0 5px 24px #22222c04;border-radius:11px;padding:7px;margin-bottom:19px}.recommend-nav{width:64px;flex-shrink:0;display:flex;flex-direction:column;justify-content:space-between}.recommend-nav button{border:0;background:none;border-radius:8px;font-size:29px;color:#5d6369;line-height:1.2;padding:7px 3px}.recommend-nav small{display:block;font-size:10px;margin-top:4px;color:#7c8491}.recommend-nav button.active{background:#e9e9eb}.banners{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;flex:1;background:#f0f0f2;padding:0 0 21px;overflow:auto;scrollbar-width:thin}.banner{border:0;border-radius:8px;background:var(--banner);height:169px;position:relative;overflow:hidden;color:#34365f;text-align:left;padding:18px;isolation:isolate}.banner strong{font-size:clamp(20px,2vw,39px);font-weight:900;letter-spacing:2px;position:relative;z-index:2;display:block}.banner-emoji{font-size:78px;position:absolute;right:7px;bottom:-10px;line-height:1.2;filter:drop-shadow(0 5px 3px #58617a16);transform:rotate(-5deg)}.banner small{display:block;position:relative;z-index:2;font-size:12px;margin-top:12px;letter-spacing:1px}.banner:hover{filter:brightness(.98)}h2{margin:0;font-weight:500;font-size:17px}.pill{display:inline-block;border-radius:30px;background:var(--accent);color:#fff;padding:3px 13px;font-size:13px;box-shadow:0 0 0 3px #e9e7ef;margin:0 0 22px}.featured{margin-bottom:24px}.tool-cards{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:22px 28px}.card{min-width:0;position:relative;border-radius:5px;background:#fff;box-shadow:0 2px 18px #26263504;transition:transform .15s,box-shadow .15s}.card:hover{transform:translateY(-3px);box-shadow:0 7px 20px #3535470b}.card>button:first-child{display:flex;align-items:center;gap:10px;width:100%;padding:16px 14px;border:0;border-radius:5px;background:transparent;text-align:left;color:inherit;min-height:70px}.icon{width:39px;height:39px;border-radius:50%;font-size:23px;display:grid;place-items:center;font-weight:750;flex-shrink:0}.card-text{display:block;min-width:0;flex:1}.card-text strong{display:block;font-size:13px;font-weight:600;color:#373a42;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.card-text>span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px;color:#89909b;margin-top:1px}.quick-save{position:absolute;right:3px;top:1px;background:#fff;border:0;font-size:13px;color:#a1a3b1;opacity:0;padding:0 3px}.card:hover .quick-save,.quick-save:focus-visible,.quick-save.selected{opacity:1}.quick-save.selected{color:var(--accent)}.catalog-head{display:flex;align-items:center;justify-content:space-between;margin:6px 0 3px}.catalog-head h2{font-size:14px;color:#858893}.catalog-head label{font-size:11px;color:#9599a2;display:flex;align-items:center;gap:5px}.catalog-head input{accent-color:var(--accent)}.results-line{display:flex;justify-content:space-between;font-size:10px;color:#9b9fa7;margin-bottom:15px}#reset{padding:0;border:0;background:none;color:#9693b3;font-size:10px}.tool-group{margin-bottom:27px;scroll-margin-top:74px}.tool-group h2{display:flex;gap:9px;align-items:center;margin:0 0 8px;color:#666d78;font-size:17px}.tool-group h2>span{font-size:21px;color:#8c929d}.category-tabs{display:flex;gap:1px;background:#e8e8ea;width:max-content;max-width:100%;border-radius:30px;padding:2px;margin-bottom:22px;overflow-x:auto;scrollbar-width:none}.category-tabs button{border:0;background:none;white-space:nowrap;color:#92939c;font-size:12px;border-radius:30px;padding:5px 12px}.category-tabs button.active{background:var(--accent);color:#fff}.tool-group:not(:has(.category-tabs)) h2{margin-bottom:20px}.group-empty{font-size:12px;color:#9b9ba6;padding:10px 12px;background:#f0f0f3;border-radius:5px}#empty{padding:40px;text-align:center;color:#92929f}footer{margin-top:32px;padding:30px 0;border-top:1px solid #ebebef;color:#9297a3;font-size:11px}footer b{font-size:22px;color:#353947;font-style:italic}footer em{color:var(--accent)}footer p{margin:12px 0}footer button{border:0;background:none;color:#7f8491;padding:0;margin-right:18px;font-size:11px}footer>span{float:right}#back-top{position:fixed;right:23px;bottom:25px;background:white;border:1px solid #eeeef3;box-shadow:0 3px 12px #00000005;border-radius:50%;height:37px;width:37px;color:#9a9ba5;font-size:19px;z-index:20}dialog{width:min(510px,92vw);padding:32px;border:0;border-radius:12px;color:#555b68;box-shadow:0 30px 80px #25253b33}dialog::backdrop{background:#27243d66;backdrop-filter:blur(3px)}dialog h2{font-size:22px;color:#353945;margin:12px 0}dialog p{font-size:13px;line-height:1.9}.detail-icon{width:56px;height:56px;border-radius:14px;font-size:30px;display:grid;place-items:center}.detail-badge{font-size:11px;background:#efecff;color:var(--accent);padding:4px 10px;border-radius:15px}.detail-note{font-size:11px!important;color:#9194a2}.action{display:inline-block;margin-top:12px;padding:11px 18px;border-radius:5px;background:var(--accent);color:white;font-size:12px}.detail-save{margin-left:12px;border:1px solid #e7e6f1;background:#fff;color:#8b83a5;border-radius:5px;padding:10px;font-size:12px}.close{position:absolute;right:12px;top:8px;font-size:26px;background:none;border:0;color:#9d9aaa}.toast{display:none}.nav-collapsed aside{transform:translateX(-100%)}.nav-collapsed main{margin-left:0}.nav-collapsed header{left:0}@media(max-width:1650px){:root{--side:200px}.content{padding-left:45px;padding-right:45px}.tool-cards{gap:20px}.card>button:first-child{padding:13px 11px;gap:8px}.icon{width:34px;height:34px;font-size:20px}.card-text strong{font-size:12px}.card-text>span{font-size:10px}.banner{height:153px;padding:16px}.banner strong{font-size:28px}.banner-emoji{font-size:67px}.brand{font-size:23px}.nav-parent{font-size:12px;padding:12px 17px}.hero{height:270px}.content{padding-top:22px}}@media(max-width:1250px){.tool-cards{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.content{padding:22px 28px 0}.banners{gap:10px}.banner{height:132px;padding:12px}.banner strong{font-size:22px;letter-spacing:0}.banner small{font-size:10px}.banner-emoji{font-size:55px}header{gap:19px}form{max-width:650px}.hero{height:255px}h1{font-size:36px;margin-bottom:20px}.recommend-nav{width:53px}.recommend-nav button{font-size:23px;padding:4px}.recommend-nav small{font-size:9px}}@media(max-width:900px){.tool-cards{grid-template-columns:repeat(3,minmax(0,1fr))}header{gap:14px;padding:0 18px}header button,header a{font-size:10px}form{max-width:85%}.banner{min-width:190px}.banners{display:flex;overflow-x:auto}.banner{flex:0 0 190px}.category-tabs button{font-size:11px;padding:5px 9px}}@media(max-width:760px){:root{--side:205px}aside{transform:translateX(-100%);box-shadow:10px 0 30px #33334412}.nav-open aside{transform:translateX(0)}main{margin:0}header{left:0;height:51px;gap:15px}header>a{font-size:11px}header [data-header="guide"],header [data-header="tutorial"],header #cooperate{display:none}.hero{height:235px;padding-top:70px}h1{font-size:30px;margin:0 0 22px}.search-modes{gap:24px}.search-modes button{font-size:11px}form{height:42px;max-width:88%}#search{font-size:12px}#search-options{font-size:9px}.content{padding:16px 16px 0}.recommend{gap:6px;padding:6px;margin-bottom:20px}.recommend-nav{width:43px}.recommend-nav button{font-size:23px}.recommend-nav small{font-size:8px}.banner{height:122px;flex-basis:205px;min-width:205px}.banner strong{font-size:27px}.banner-emoji{font-size:64px}.banners{padding-bottom:6px;gap:10px}.tool-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.card>button:first-child{padding:12px 10px;min-height:65px;gap:8px}.icon{width:32px;height:32px;font-size:19px}.card-text strong{font-size:11px}.card-text>span{font-size:9px}.quick-save{opacity:1;right:2px;top:-1px;font-size:11px}.pill{font-size:11px;margin-bottom:17px;padding:3px 11px}.featured{margin-bottom:20px}.tool-group h2{font-size:15px}.category-tabs{margin-bottom:16px}.category-tabs button{font-size:10px;padding:5px 9px}.catalog-head label{font-size:9px}.catalog-head h2{font-size:12px}.results-line{font-size:9px}.tool-group{margin-bottom:24px}footer>span{float:none;display:block;margin-top:16px}#back-top{right:12px;bottom:15px;height:32px;width:32px}.subnav button{padding-left:50px}dialog{padding:25px}.detail-save{margin-left:7px}html{scroll-padding-top:15px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.icon img{width:100%;height:100%;object-fit:contain;border-radius:50%}.icon img[hidden],.icon span[hidden]{display:none}.recommend,.banners{min-width:0}body{overflow-x:hidden}

.detail-audience{font-size:12px!important}.detail-audience b{font-weight:500;color:#777085;margin-right:8px}.source-note{font-size:10px!important;color:#a29aad;line-height:1.7!important;border-top:1px solid #eeebf3;padding-top:12px}.source-note a{color:#8072d0}

/* Shared card/detail branding without clipping square logos. */
.icon img,.detail-icon img{width:100%;height:100%;object-fit:contain;border-radius:6px}
.detail-icon img{padding:5px}
.detail-icon img[hidden],.detail-icon span[hidden]{display:none}
.hero-subtitle{margin:-16px 0 13px;font-size:12px;color:#777d8a;text-shadow:none;letter-spacing:.5px}
@media(max-width:760px){.hero-subtitle{font-size:11px;margin-top:-14px;margin-bottom:10px}}
