.tool-list-root{--cat-code:oklch(58% .19 285);--cat-ai:oklch(58% .16 232);--cat-data:oklch(58% .14 165);--cat-hw:oklch(64% .16 55);--cat-make:oklch(60% .18 330)}.tool-list-root .shell{max-width:1320px;margin:0 auto;padding:28px 32px 48px}.tool-list-root .hero{border-radius:var(--r-xl);color:#fff;isolation:isolate;background:radial-gradient(60% 90% at 100% 0,oklch(70% .18 280/.4) 0%,#0000 60%),radial-gradient(80% 100% at 0 100%,oklch(80% .1 220/.45) 0%,#0000 62%),linear-gradient(135deg,oklch(40% .18 280) 0%,oklch(30% .16 278) 55%,oklch(22% .11 272) 100%);grid-template-columns:1.3fr 1fr;align-items:center;gap:40px;padding:32px 56px;display:grid;position:relative;overflow:hidden}.tool-list-root .hero:before{content:"";z-index:-1;background-image:linear-gradient(oklch(100% 0 0/.06) 1px,#0000 1px),linear-gradient(90deg,oklch(100% 0 0/.06) 1px,#0000 1px);background-size:44px 44px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(90% 80% at 30% 40%,#000,#0000);mask-image:radial-gradient(90% 80% at 30% 40%,#000,#0000)}.tool-list-root .heroEyebrow{border-radius:var(--r-pill);letter-spacing:.14em;font-size:11px;font-family:var(--font-mono);color:oklch(100% 0 0/.92);background:oklch(100% 0 0/.14);border:1px solid oklch(100% 0 0/.22);align-items:center;gap:8px;padding:6px 14px;font-weight:500;display:inline-flex}.tool-list-root .heroEyebrow .live{background:oklch(80% .18 150);border-radius:50%;width:6px;height:6px;animation:2s ease-in-out infinite tlPulse;box-shadow:0 0 0 4px oklch(80% .18 150/.25)}@keyframes tlPulse{0%,to{opacity:1}50%{opacity:.4}}.tool-list-root .hero h1{letter-spacing:-.025em;background:linear-gradient(#fff,oklch(86% .06 280));color:#0000;-webkit-background-clip:text;background-clip:text;margin:20px 0 14px;font-size:46px;font-weight:800;line-height:1.06}.tool-list-root .hero .lead{color:oklch(100% 0 0/.78);max-width:440px;margin:0;font-size:15px;line-height:1.7}.tool-list-root .heroStats{border-top:1px solid oklch(100% 0 0/.16);gap:44px;margin-top:30px;padding-top:24px;display:flex}.tool-list-root .heroStats .v{font-family:var(--font-num);letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-size:28px;font-weight:700}.tool-list-root .heroStats .v .u{opacity:.65;margin-left:3px;font-size:12px;font-weight:500}.tool-list-root .heroStats .l{color:oklch(100% 0 0/.6);letter-spacing:.12em;font-size:10px;font-family:var(--font-mono);margin-top:4px}.tool-list-root .heroArt{height:200px;position:relative}.tool-list-root .floatTile{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#fff;background:oklch(100% 0 0/.12);border:1px solid oklch(100% 0 0/.24);border-radius:14px;align-items:center;gap:10px;padding:11px 15px;display:flex;position:absolute;box-shadow:0 12px 32px oklch(0% 0 0/.25)}.tool-list-root .floatTile .ic{border-radius:9px;flex-shrink:0;place-items:center;width:30px;height:30px;display:grid}.tool-list-root .floatTile .ic svg{color:#fff;width:16px;height:16px}.tool-list-root .floatTile .nm{font-size:13px;font-weight:600}.tool-list-root .floatTile .sub{opacity:.65;font-size:9px;font-family:var(--font-mono);letter-spacing:.06em;margin-top:1px}.tool-list-root .floatTile.a{animation:8s ease-in-out infinite tlFloat;top:8px;left:20px}.tool-list-root .floatTile.b{animation:10s ease-in-out -4s infinite tlFloat;top:96px;right:0}.tool-list-root .floatTile.c{animation:9s ease-in-out -6s infinite tlFloat;bottom:6px;left:46px}.tool-list-root .floatTile.a .ic{background:linear-gradient(135deg, var(--cat-code), oklch(42% .19 285))}.tool-list-root .floatTile.b .ic{background:linear-gradient(135deg, var(--cat-ai), oklch(44% .16 232))}.tool-list-root .floatTile.c .ic{background:linear-gradient(135deg, var(--cat-hw), oklch(50% .16 50))}@keyframes tlFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}.tool-list-root .toolbar{flex-wrap:wrap;align-items:center;gap:14px;margin-top:28px;display:flex}.tool-list-root .searchBox{border-radius:var(--r-pill);background:var(--card);border:1px solid var(--input);flex:1;align-items:center;gap:10px;min-width:260px;padding:11px 16px;display:flex}.tool-list-root .searchBox svg{width:16px;height:16px;color:var(--muted-foreground);flex-shrink:0}.tool-list-root .searchBox input{color:var(--foreground);background:0 0;border:none;outline:none;flex:1;min-width:0;font-family:inherit;font-size:14px}.tool-list-root .searchBox input::placeholder{color:color-mix(in oklab, var(--muted-foreground) 70%, transparent)}.tool-list-root .searchBox .kbd{font-size:10px;font-family:var(--font-mono);color:var(--muted-foreground);background:var(--muted);border:1px solid var(--border);border-radius:6px;padding:3px 7px}.tool-list-root .sortSel{border-radius:var(--r-pill);background:var(--card);border:1px solid var(--input);color:var(--foreground-subtle);cursor:pointer;align-items:center;gap:8px;padding:11px 16px;font-size:13px;display:flex;position:relative}.tool-list-root .sortSel svg{width:14px;height:14px;color:var(--muted-foreground);flex-shrink:0}.tool-list-root .sortSel b{color:var(--foreground);font-weight:600}.tool-list-root .sortSel select{opacity:0;cursor:pointer;width:100%;height:100%;font-family:inherit;position:absolute;inset:0}.tool-list-root .sortCount{font-family:var(--font-mono);color:var(--muted-foreground);font-size:12px}.tool-list-root .catFilter{flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px;display:flex}.tool-list-root .catPill{border-radius:var(--r-pill);cursor:pointer;background:var(--card);border:1px solid var(--border);color:var(--foreground-subtle);transition:all var(--dur-fast) var(--ease-out);align-items:center;gap:8px;padding:8px 15px;font-family:inherit;font-size:13px;font-weight:500;display:inline-flex}.tool-list-root .catPill:hover{border-color:color-mix(in oklab, var(--primary) 50%, transparent);color:var(--foreground)}.tool-list-root .catPill .dot{border-radius:50%;width:8px;height:8px}.tool-list-root .catPill.active{color:#fff;box-shadow:var(--elevation-2);background:linear-gradient(135deg, var(--primary), var(--primary-strong));border-color:#0000}.tool-list-root .catPill.active .dot{background:oklch(100% 0 0/.9)}.tool-list-root .catPill .dot.code{background:var(--cat-code)}.tool-list-root .catPill .dot.ai{background:var(--cat-ai)}.tool-list-root .catPill .dot.data{background:var(--cat-data)}.tool-list-root .catPill .dot.hw{background:var(--cat-hw)}.tool-list-root .catPill .dot.make{background:var(--cat-make)}.tool-list-root .secLabel{align-items:baseline;gap:12px;margin:36px 0 18px;display:flex}.tool-list-root .secLabel h2{color:var(--foreground);letter-spacing:-.01em;margin:0;font-size:20px;font-weight:700}.tool-list-root .secLabel .en{color:var(--muted-foreground);letter-spacing:.18em;font-size:11px;font-family:var(--font-mono);font-weight:500}.tool-list-root .secLabel .count{color:var(--muted-foreground);font-size:12px;font-family:var(--font-mono);margin-left:auto}.tool-list-root .toolGrid{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}.tool-list-root .toolCard{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);transition:transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out), border-color var(--dur-fast) var(--ease-out);flex-direction:column;gap:14px;padding:20px;display:flex;position:relative;overflow:hidden}.tool-list-root .toolCard:before{content:"";background:var(--acc,var(--primary));width:4px;position:absolute;top:0;bottom:0;left:0}.tool-list-root .toolCard:hover{box-shadow:var(--elevation-3);border-color:var(--acc,color-mix(in oklab, var(--primary) 50%, transparent));transform:translateY(-3px)}.tool-list-root .toolCard[data-cat=code]{--acc:var(--cat-code)}.tool-list-root .toolCard[data-cat=ai]{--acc:var(--cat-ai)}.tool-list-root .toolCard[data-cat=data]{--acc:var(--cat-data)}.tool-list-root .toolCard[data-cat=hw]{--acc:var(--cat-hw)}.tool-list-root .toolCard[data-cat=make]{--acc:var(--cat-make)}.tool-list-root .tcMain{color:inherit;flex-direction:column;gap:14px;text-decoration:none;display:flex}.tool-list-root .tcTop{align-items:flex-start;gap:13px;display:flex}.tool-list-root .tcIcon{color:#fff;width:46px;height:46px;box-shadow:var(--elevation-2);background:linear-gradient(135deg, color-mix(in oklch, var(--acc) 80%, white), var(--acc));border-radius:13px;flex-shrink:0;place-items:center;display:grid;overflow:hidden}.tool-list-root .tcIcon svg{width:22px;height:22px}.tool-list-root .tcIcon img{object-fit:cover;width:100%;height:100%}.tool-list-root .tcHead{flex:1;min-width:0}.tool-list-root .tcHead .nm{color:var(--foreground);letter-spacing:-.005em;text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:700;overflow:hidden}.tool-list-root .tcHead .en{color:var(--muted-foreground);font-size:10px;font-family:var(--font-mono);letter-spacing:.1em;margin-top:3px;font-weight:500}.tool-list-root .tcStatus{background:var(--success-subtle);color:oklch(42% .13 155);border-radius:999px;flex-shrink:0;align-items:center;gap:5px;padding:3px 9px;font-size:10px;font-weight:600;display:inline-flex}.tool-list-root .tcStatus:before{content:"";background:var(--success-solid);border-radius:50%;width:5px;height:5px}.tool-list-root .tcStatus.muted{background:var(--warning-subtle);color:oklch(46% .16 55)}.tool-list-root .tcStatus.muted:before{background:var(--warning-solid)}.tool-list-root .tcDesc{color:var(--foreground-subtle);-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:2.6em;font-size:13px;line-height:1.6;display:-webkit-box;overflow:hidden}.tool-list-root .tcTags{flex-wrap:wrap;gap:6px;display:flex}.tool-list-root .tcTag{background:var(--muted);color:var(--foreground-subtle);border-radius:999px;padding:3px 10px;font-size:11px;font-weight:500}.tool-list-root .tcTag.cat{background:color-mix(in oklch, var(--acc) 14%, white);color:color-mix(in oklch, var(--acc) 60%, black)}.tool-list-root .tcFoot{border-top:1px solid var(--border);justify-content:space-between;align-items:center;margin-top:auto;padding-top:13px;display:flex}.tool-list-root .tcMeta{color:var(--foreground-subtle);gap:15px;font-size:12px;display:flex}.tool-list-root .tcMeta .it{align-items:center;gap:5px;display:flex}.tool-list-root .tcMeta .it svg{width:13px;height:13px;color:var(--muted-foreground)}.tool-list-root .tcMeta .it b{color:var(--foreground);font-family:var(--font-num);font-variant-numeric:tabular-nums;font-weight:600}.tool-list-root .tcOpen{color:var(--acc,var(--primary-strong));cursor:pointer;align-items:center;gap:6px;font-size:12px;font-weight:600;text-decoration:none;display:inline-flex}.tool-list-root .tcOpen svg{width:14px;height:14px}.tool-list-root .stateWrap{text-align:center;place-items:center;min-height:40vh;display:grid}.tool-list-root .spinner{border:3px solid var(--border);border-bottom-color:var(--primary);border-radius:50%;width:48px;height:48px;margin:0 auto 16px;animation:.9s linear infinite tlSpin}@keyframes tlSpin{to{transform:rotate(360deg)}}.tool-list-root .stateText{color:var(--muted-foreground);font-size:14px}.tool-list-root .emptyNote{color:var(--muted-foreground);text-align:center;margin:36px 0;font-size:14px;line-height:1.7}@media (width<=1024px){.tool-list-root .hero{grid-template-columns:1fr;gap:32px;padding:40px}.tool-list-root .heroArt{display:none}.tool-list-root .hero h1{font-size:38px}.tool-list-root .toolGrid{grid-template-columns:repeat(2,1fr)}}@media (width<=768px){.tool-list-root .toolGrid{grid-template-columns:repeat(2,1fr)}}@media (width<=640px){.tool-list-root .shell{padding:20px 16px 40px}.tool-list-root .hero{padding:32px 24px}.tool-list-root .hero h1{font-size:32px}.tool-list-root .heroStats{gap:28px}.tool-list-root .toolGrid{grid-template-columns:1fr}}