:root{color-scheme:light;--surface:#f5fafc;--surface-container:#eaf1f5;--text:#20282c;--muted:#7e898f;--line:#dce5e9;--primary:#176c82;--selected:#d3e8ee;--hover:#e8f1f5;--dialog:#f5fafc;--sidebar:192px;--header:112px;--shadow:0 16px 64px #19394624}
*{box-sizing:border-box}body{margin:0;background:var(--surface);color:var(--text);font-family:"Noto Sans SC","Microsoft YaHei","PingFang SC",system-ui,sans-serif;-webkit-font-smoothing:antialiased}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none}svg{display:block;width:24px;height:24px;fill:currentColor}button{border:0}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--primary);outline-offset:4px}.skip-link{position:fixed;top:-80px;left:16px;z-index:99;padding:12px;background:var(--selected);border-radius:16px}.skip-link:focus{top:12px}.topbar{height:var(--header);display:flex;align-items:center;gap:24px;padding:0 32px 0 24px;background:var(--surface);position:fixed;inset:0 0 auto;z-index:10}.icon-button{display:grid;place-items:center;width:48px;height:48px;flex-shrink:0;border-radius:50%;background:transparent;color:#46535a;transition:background .2s,color .2s}.icon-button:hover{background:var(--hover)}.icon-button:active{background:var(--selected)}.menu-toggle svg{width:28px;height:28px}.brand{display:flex;flex-direction:column;gap:6px;flex-shrink:0}.brand-name{font-size:32px;line-height:1.15;letter-spacing:2px;font-weight:600}.brand-dot{color:var(--primary);margin-left:2px}.motto{font-size:14px;color:var(--muted);letter-spacing:1px;font-family:"Noto Serif SC","Songti SC",SimSun,serif}.header-actions{margin-left:auto;display:flex;align-items:center;gap:8px}.search-wrap{display:flex;align-items:center;gap:12px;border-radius:28px;background:var(--surface-container);height:48px;width:250px;padding:0 16px;color:var(--muted);margin-right:14px}.search-wrap input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--text);font-size:14px}.search-wrap input:focus-visible{outline:0}.search-wrap:focus-within{box-shadow:0 0 0 2px var(--primary)}.search-wrap svg{width:21px;flex-shrink:0}.search-wrap kbd{font-size:12px;border:1px solid var(--line);border-radius:5px;padding:0 5px}.search-toggle{display:none}.sidebar{position:fixed;left:0;top:var(--header);bottom:0;width:var(--sidebar);z-index:9;display:flex;flex-direction:column;padding:8px 14px 10px 0;background:var(--surface);border-right:1px solid var(--line);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--line) transparent;transition:transform .22s}.category{position:relative;display:flex;align-items:center;gap:18px;padding:0 24px 0 28px;width:100%;height:54px;border-radius:0 32px 32px 0;margin:0 0 6px;background:transparent;color:#59666c;text-align:left;font-size:17px;letter-spacing:1px;white-space:nowrap;transition:background .2s}.category svg{color:#929da3;width:22px;height:22px;flex-shrink:0}.category:hover{background:var(--hover)}.category.active{background:var(--selected);color:var(--primary);font-weight:600}.category.active svg{color:var(--primary)}.category.active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--primary)}.sidebar-bottom{font-size:11px;color:var(--muted);padding:24px 0 12px 28px;display:flex;align-items:center;gap:7px;margin-top:auto;white-space:nowrap}.tiny-dot{width:5px;height:5px;border-radius:50%;background:#80ada5}main{margin-left:var(--sidebar);padding:calc(var(--header) + 24px) 40px 0;min-height:100dvh;transition:margin-left .22s}.content{max-width:1100px;margin:0 auto}.section-heading{display:flex;align-items:center;justify-content:space-between;margin:0 8px 12px;min-height:40px}.section-heading h1{display:inline-flex;align-items:center;font-size:18px;line-height:1.5;font-weight:600;border-radius:24px;background:var(--selected);padding:6px 20px;margin:0;color:#375c68;letter-spacing:1px}.section-heading>span{font-size:12px;color:var(--muted);letter-spacing:1px}.tool-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:10px;row-gap:8px}.tool-card{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:15px;min-width:0;min-height:162px;padding:18px 4px 20px;border-radius:28px;transition:background .2s,transform .2s}.tool-card:hover{background:var(--hover);transform:translateY(-3px)}.tool-card:active{transform:scale(.97)}.tool-icon{position:relative;display:grid;place-items:center;width:84px;height:84px;flex-shrink:0;border-radius:50%;background:var(--icon-bg);color:var(--icon-color);transition:transform .25s}.tool-icon svg{width:34px;height:34px}.tool-card:hover .tool-icon{transform:scale(1.06)}.tool-name{font-size:15px;line-height:1.6;font-weight:550;text-align:center;letter-spacing:.3px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tool-dot{position:absolute;right:1px;top:3px;width:15px;height:15px;background:#e7ac25;border:2px solid var(--surface);border-radius:50%}.orange{--icon-bg:#fff1dd;--icon-color:#f58200}.coral{--icon-bg:#fce9e6;--icon-color:#e94b22}.indigo{--icon-bg:#e9e9f7;--icon-color:#3e48a4}.yellow{--icon-bg:#fffbe3;--icon-color:#f7bb25}.pink{--icon-bg:#fbe5ee;--icon-color:#d91b70}.cyan{--icon-bg:#ddf6fa;--icon-color:#00a9c2}.green{--icon-bg:#e7f5e9;--icon-color:#388f48}.blue{--icon-bg:#e2f1ff;--icon-color:#237dd2}.red{--icon-bg:#ffebee;--icon-color:#d9393c}.purple{--icon-bg:#f3e6f8;--icon-color:#9628b0}footer{display:flex;align-items:center;gap:8px;margin:48px 8px 0;padding:24px 0 30px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}footer>span:first-child{font-weight:600;color:#70848d}.footer-dot{opacity:.5}.footer-note{margin-left:auto;letter-spacing:1px}.empty-state{text-align:center;padding:80px 16px 110px}.empty-state[hidden]{display:none}.empty-icon{display:grid;place-items:center;width:88px;height:88px;background:var(--surface-container);border-radius:32px;color:var(--muted);margin:0 auto 20px}.empty-icon svg{width:36px;height:36px}.empty-state h2{font-size:20px;font-weight:500;margin:0 0 12px}.empty-state p{color:var(--muted);font-size:14px;line-height:1.8}.text-button{border-radius:24px;padding:12px 20px;background:transparent;color:var(--primary);margin-top:12px;font-weight:600}.text-button:hover{background:var(--selected)}.text-button span{margin-left:8px}dialog{position:fixed;width:calc(100% - 40px);max-width:440px;border:0;border-radius:32px;padding:40px 32px 28px;color:var(--text);background:var(--dialog);box-shadow:var(--shadow);text-align:center}dialog::backdrop{background:#142b3566;backdrop-filter:blur(4px)}dialog .tool-icon{margin:0 auto 22px;width:88px;height:88px}.dialog-close{position:absolute;right:12px;top:12px;width:40px;height:40px}dialog h2{font-size:24px;font-weight:550;line-height:1.5;margin:12px 0}dialog p{font-size:14px;line-height:1.9;margin:12px 0;color:var(--muted)}.status-label{display:inline-block;border-radius:20px;background:var(--surface-container);padding:5px 12px;font-size:11px;color:var(--primary);letter-spacing:2px}dialog .dialog-note{font-size:13px}.filled-button{display:block;width:100%;border-radius:28px;background:var(--primary);color:#fff;padding:14px 24px;margin-top:28px;font-size:14px;font-weight:600}.filled-button:hover{filter:brightness(1.1)}.notice-symbol{display:grid;place-items:center;width:72px;height:72px;margin:0 auto 20px;background:var(--selected);color:var(--primary);border-radius:24px}.notice-symbol svg{width:32px;height:32px}.noscript{position:fixed;bottom:10px;background:var(--selected);padding:16px;border-radius:20px;left:25%}body.nav-collapsed .sidebar{transform:translateX(-100%)}body.nav-collapsed main{margin-left:0}
html[data-theme=dark]{color-scheme:dark;--surface:#111a1e;--surface-container:#1e2a30;--text:#dce7ed;--muted:#96a7af;--line:#2b3a42;--primary:#98d2e4;--selected:#254754;--hover:#1b2a31;--dialog:#1b292f;--shadow:0 16px 64px #0006}html[data-theme=dark] .icon-button,html[data-theme=dark] .category{color:#a6b6bf}html[data-theme=dark] .category.active{color:var(--primary)}html[data-theme=dark] .section-heading h1{color:#b5dbe8}html[data-theme=dark] .tool-icon{background:color-mix(in srgb,var(--icon-color) 16%,#19252a);color:color-mix(in srgb,var(--icon-color) 65%,white)}html[data-theme=dark] .filled-button{color:#11333e}
@media(min-width:1600px){main{padding-top:calc(var(--header) + 36px)}.tool-grid{row-gap:20px}.tool-card{min-height:176px}.tool-icon{width:90px;height:90px}}
@media(max-width:1190px){.tool-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.search-wrap{width:210px}.topbar{gap:18px}.motto{font-size:13px}}
@media(max-width:850px){:root{--sidebar:142px;--header:112px}.topbar{padding:0 20px;gap:20px}.brand-name{font-size:32px}.header-actions{gap:4px}.search-wrap{display:none}.search-toggle{display:grid;order:3}#theme-toggle{order:2}#announcement{order:1}.category{height:66px;padding-left:26px;gap:13px;font-size:20px;margin-bottom:7px}.category svg{width:21px;height:21px}.sidebar{padding-right:10px}.sidebar-bottom{display:none}main{padding:calc(var(--header) + 20px) 24px 0}.tool-grid{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:8px;row-gap:8px}.tool-card{min-height:152px;padding:16px 0 18px;gap:14px}.tool-name{font-size:16px}.section-heading{margin-left:8px}.section-heading>span{font-size:11px;letter-spacing:0}.search-open .search-wrap{display:flex;position:absolute;top:calc(var(--header) - 5px);left:calc(var(--sidebar) + 20px);right:20px;width:auto;margin:0;box-shadow:var(--shadow)}.search-open main{padding-top:calc(var(--header) + 68px)}.search-open.nav-collapsed .search-wrap{left:20px}.search-wrap kbd{display:none}.motto{font-size:14px;letter-spacing:0}.footer-note{display:none}}
@media(min-width:601px) and (max-width:700px){.topbar{gap:18px;padding-left:20px}.topbar #theme-toggle{display:none}.tool-icon{width:82px;height:82px}.tool-name{font-size:17px}main{padding-left:24px;padding-right:24px}}
@media(max-width:600px){:root{--sidebar:90px;--header:96px}.topbar{padding:0 12px;gap:10px}.menu-toggle{width:36px}.brand{gap:7px}.brand-name{font-size:26px;letter-spacing:1px}.motto{font-size:11px;max-width:210px}.header-actions{gap:0}.header-actions .icon-button{width:36px;height:40px}.header-actions svg{width:22px;height:22px}#announcement{display:none}.sidebar{padding-right:8px;padding-top:10px}.category{flex-direction:column;justify-content:center;gap:7px;height:68px;padding:0;font-size:12px;letter-spacing:1px;border-radius:0 22px 22px 0;margin-bottom:3px}.category svg{width:21px;height:21px}.category.active:before{width:3px}main{padding:calc(var(--header) + 15px) 12px 0}.section-heading{margin:0 4px 10px}.section-heading h1{font-size:15px;padding:5px 16px}.section-heading>span{font-size:10px}.tool-grid{column-gap:2px;row-gap:6px}.tool-card{gap:12px;min-height:131px;padding:14px 1px 12px;border-radius:20px}.tool-icon{width:64px;height:64px}.tool-icon svg{width:28px;height:28px}.tool-name{font-size:12px;letter-spacing:0}.tool-dot{width:13px;height:13px;top:1px;right:0}footer{font-size:10px;gap:5px;margin-top:32px}.search-open .search-wrap{left:102px;right:12px}.empty-state{padding:60px 4px}.empty-state h2{font-size:17px}.empty-state p{font-size:12px}}
@media(max-width:374px){.motto{font-size:10px;max-width:165px}.header-actions .icon-button{width:32px}.tool-icon{width:56px;height:56px}.tool-name{font-size:11px}.tool-card{min-height:123px}:root{--sidebar:78px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}

/* 内容不足一屏时，将页脚推到视口底部。 */
main{display:flex;flex-direction:column}
.content{display:flex;flex:1;flex-direction:column;width:100%}
.content>*{flex-shrink:0}
.tool-grid:not(:empty){margin-bottom:48px}
footer{margin-top:auto}
@media(max-width:600px){.tool-grid:not(:empty){margin-bottom:32px}}
