@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Noto+Sans+TC:wght@400;500;600;700;800&display=swap');
:root{color-scheme:light;--bg:#f4f5f2;--glow:#dfe7e4;--surface:#fcfdfa;--surface-soft:#e8edeb;--text:#27323a;--muted:#68777b;--line:#d8e0dd;--accent:#4d716d;--accent-soft:#e1ebe7;--button:#4d716d;--button-text:#fcfdfa;--shadow:#1d2c3218;--banner-a:#e4ece8;--banner-b:#d8e3e7;--error:#9a5d59;font-family:'DM Sans','Noto Sans TC',sans-serif}
:root[data-theme=dark]{color-scheme:dark;--bg:#1b252d;--glow:#33454c;--surface:#25333d;--surface-soft:#30424b;--text:#e9efeb;--muted:#aebebb;--line:#4b5e62;--accent:#a8c2b7;--accent-soft:#334e4b;--button:#a8c2b7;--button-text:#1b252d;--shadow:#0d171e80;--banner-a:#30454b;--banner-b:#263841;--error:#d0a5a0}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(circle at 90% -8%,var(--glow),transparent 42%),radial-gradient(circle at 2% 60%,color-mix(in srgb,var(--glow) 62%,transparent),transparent 35%),var(--bg);color:var(--text)}body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.3;background-image:radial-gradient(circle at 9% 13%,var(--text) 0 1px,transparent 1.5px),radial-gradient(circle at 81% 19%,var(--text) 0 1px,transparent 1.5px),radial-gradient(circle at 45% 68%,var(--text) 0 1px,transparent 1.5px),radial-gradient(circle at 91% 77%,var(--text) 0 1px,transparent 1.5px);background-size:410px 380px,520px 450px,620px 600px,730px 650px}body>*{position:relative}main{flex:1}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.wrap{width:min(1160px,calc(100% - 48px));margin-inline:auto}.topbar{height:78px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px;font-size:17px;letter-spacing:-.04em;font-weight:800}.brand-mark{display:grid;place-items:center;width:37px;height:37px;border-radius:11px;background:linear-gradient(135deg,#8ea7a3,#6c8890);color:#fff;font-size:25px;font-weight:400;box-shadow:0 5px 20px #4d716d40}.brand-sub{color:var(--muted);font-weight:500}.theme-toggle{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:9px 13px;background:color-mix(in srgb,var(--surface) 80%,transparent);color:var(--text);font-size:12px;font-weight:700;cursor:pointer;transition:border-color .2s,transform .2s}.theme-toggle:hover{border-color:var(--accent);transform:translateY(-1px)}.theme-toggle span:first-child{font-size:18px;line-height:1}.eyebrow{margin:0;color:var(--accent);font-size:10px;font-weight:800;letter-spacing:.19em}.directory{padding:26px 0 70px}.directory-heading{position:relative;display:flex;align-items:center;min-height:205px;padding:32px 42px;overflow:hidden;border:1px solid color-mix(in srgb,var(--line) 80%,transparent);border-radius:22px;background:linear-gradient(116deg,var(--banner-a),var(--banner-b) 70%,var(--banner-a));box-shadow:0 18px 52px var(--shadow)}.directory-heading::before{content:"";position:absolute;width:420px;height:420px;right:-120px;top:-215px;border-radius:50%;background:radial-gradient(circle,#a5c5bd55,transparent 67%);filter:blur(2px)}.heading-copy{position:relative;z-index:1}.heading-copy .eyebrow{color:color-mix(in srgb,var(--text) 70%,var(--accent));font-size:11px}.heading-copy .eyebrow span{color:var(--accent);margin:0 5px}.directory h1{font-size:clamp(42px,5vw,63px);line-height:1.12;letter-spacing:-.075em;margin:18px 0 0}.title-spark{position:relative;top:-20px;margin-left:13px;color:var(--accent);font-size:23px;font-weight:400}.orbit-art{position:absolute;right:64px;top:-65px;width:340px;height:340px;display:grid;place-items:center;transform:rotate(-20deg)}.orbit-ring{position:absolute;border:1px solid color-mix(in srgb,var(--text) 32%,transparent);border-radius:50%}.orbit-one{width:270px;height:155px;transform:rotate(35deg)}.orbit-two{width:190px;height:280px;transform:rotate(35deg)}.orbit-center{display:grid;place-items:center;width:112px;height:112px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#c6d9d3,#738f91 52%,#526c70 85%);box-shadow:0 0 50px #93b5ad70;color:#fff;font-size:80px;font-weight:400}.orbit-spark{position:absolute;color:#fff;text-shadow:0 0 17px #fff;font-size:29px}.orbit-spark-a{left:28px;top:125px}.orbit-spark-b{right:38px;bottom:84px;font-size:42px}.search{display:flex;align-items:center;gap:13px;height:58px;margin:20px 0 22px;padding:0 18px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--surface) 90%,transparent);box-shadow:0 9px 25px var(--shadow);color:var(--muted)}.search:focus-within{outline:2px solid var(--accent);outline-offset:2px}.search-icon{font-size:28px;line-height:1}.search input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--text);font-size:14px}.search input::placeholder{color:var(--muted)}.search kbd{display:grid;place-items:center;width:26px;height:26px;border:1px solid var(--line);border-radius:6px;background:var(--surface-soft);font-size:11px}.browse-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:19px}.browse-heading>span{color:var(--muted);font-size:12px;white-space:nowrap}.filters{display:flex;gap:8px;flex-wrap:wrap}.filters button{padding:8px 15px;border:1px solid var(--line);border-radius:100px;background:color-mix(in srgb,var(--surface) 75%,transparent);color:var(--muted);font-size:12px;font-weight:700;cursor:pointer;transition:.2s}.filters button[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft);color:var(--accent);box-shadow:0 0 18px color-mix(in srgb,var(--accent) 20%,transparent)}.filters button:hover:not([aria-pressed=true]){border-color:var(--accent);color:var(--text)}.tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.tool-card{position:relative;display:flex;flex-direction:column;min-height:265px;padding:21px 22px;border:1px solid var(--line);border-radius:16px;background:var(--surface);overflow:hidden;isolation:isolate;box-shadow:0 10px 32px var(--shadow);transition:transform .2s,border-color .2s,box-shadow .2s}.tool-card::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.85;background:radial-gradient(circle at 72% 40%,#8ca8a633,transparent 54%)}.tool-card[data-tool=pdf-split]::before{background:radial-gradient(circle at 72% 37%,#91a9a338,transparent 56%)}.tool-card[data-tool=qr-code]::before{background:radial-gradient(circle at 65% 34%,#7b9b9a40,transparent 56%)}.tool-card:hover{transform:translateY(-6px);border-color:var(--accent);box-shadow:0 20px 44px var(--shadow)}.card-top{display:flex;justify-content:space-between;align-items:center}.card-index{color:var(--accent);font-size:12px;font-weight:800;letter-spacing:.13em}.tag{padding:6px 10px;border:1px solid var(--line);border-radius:100px;color:var(--muted);font-size:10px;font-weight:700}.tool-visual{position:relative;flex:1;min-height:130px;display:grid;place-items:center}.tool-visual span{position:absolute;display:block}.visual-pdf-merge span:first-child,.visual-pdf-merge span:nth-child(2){width:76px;height:98px;border:2px solid #b7c7c8;border-radius:8px;background:linear-gradient(#aebebe4d,#6f838228),repeating-linear-gradient(180deg,transparent 0 14px,#b7c7c860 15px 17px);box-shadow:0 13px 28px #14252b44}.visual-pdf-merge span:first-child{transform:translate(-23px,5px) rotate(-12deg)}.visual-pdf-merge span:nth-child(2){transform:translate(23px,-4px) rotate(9deg);background:linear-gradient(145deg,#e1ebe9,#acbfc0)}.visual-pdf-merge span:nth-child(3){width:33px;height:33px;border-radius:50%;background:#e9efeb;transform:translate(53px,35px);box-shadow:0 0 23px #e4efea;color:#365e5b}.visual-pdf-merge span:nth-child(3)::after{content:"✦";position:absolute;inset:0;display:grid;place-items:center;font-size:23px}.visual-pdf-split span:first-child,.visual-pdf-split span:nth-child(2){width:63px;height:96px;border:2px solid #cededa;border-radius:8px;background:linear-gradient(145deg,#c1d2cf,#9fb6b6);box-shadow:0 14px 27px #1c333455}.visual-pdf-split span:first-child{transform:translate(-38px,0) rotate(-12deg)}.visual-pdf-split span:nth-child(2){transform:translate(38px,0) rotate(12deg)}.visual-pdf-split span:nth-child(3){width:3px;height:112px;background:repeating-linear-gradient(to bottom,#e9efeb 0 7px,transparent 7px 14px);transform:rotate(0)}.visual-qr-code span{width:45px;height:45px;border:7px solid #a9beb9;border-radius:5px;box-shadow:0 0 20px #7c9b985c}.visual-qr-code span::after{content:"";position:absolute;inset:7px;background:#d1e0d9}.visual-qr-code span:first-child{transform:translate(-44px,-32px)}.visual-qr-code span:nth-child(2){transform:translate(44px,-32px)}.visual-qr-code span:nth-child(3){transform:translate(-44px,50px)}.card-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto}.card-bottom h3{font-size:20px;letter-spacing:-.04em;margin:0}.card-arrow{display:grid;place-items:center;width:35px;height:35px;border:1px solid var(--line);border-radius:50%;background:var(--surface-soft);color:var(--accent);font-size:21px;transition:transform .2s,background .2s}.tool-card:hover .card-arrow{transform:translate(3px,-3px);background:var(--accent-soft)}.empty-state{padding:45px;border:1px dashed var(--line);border-radius:12px;text-align:center;color:var(--muted)}footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:24px 0 30px;border-top:1px solid var(--line);color:var(--muted);font-size:11px}.footer-spark{color:var(--accent);font-size:20px}footer a:hover{color:var(--accent)}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:900px){.orbit-art{right:-5px}.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.wrap{width:calc(100% - 32px)}.topbar{height:70px}.directory{padding-top:16px}.directory-heading{min-height:172px;padding:25px;border-radius:16px}.directory h1{font-size:43px}.heading-copy .eyebrow{font-size:9px}.orbit-art{right:-115px;top:-85px;transform:rotate(-20deg) scale(.7);opacity:.65}.title-spark{font-size:17px;top:-16px}.tool-grid{grid-template-columns:1fr;gap:13px}.tool-card{min-height:240px}.search{margin-top:16px}.browse-heading{align-items:flex-start}.browse-heading>span{padding-top:10px}.filters{gap:6px}.filters button{padding:7px 11px;font-size:11px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
.header-actions{display:flex;align-items:center;gap:10px}.lang-toggle{min-width:44px;height:38px;padding:0 11px;border:1px solid var(--line);border-radius:10px;background:color-mix(in srgb,var(--surface) 80%,transparent);color:var(--text);font-size:12px;font-weight:800;cursor:pointer}.lang-toggle:hover{border-color:var(--accent);color:var(--accent)}@media(max-width:620px){.header-actions{gap:6px}.lang-toggle{height:35px}}
/* Compact layout */
body{display:block;min-height:0}main{display:block}.directory{padding:16px 0 38px}.directory-heading{min-height:155px;padding:22px 32px}.directory h1{font-size:clamp(36px,4.3vw,54px);margin-top:11px}.orbit-art{top:-92px;right:30px;transform:rotate(-20deg) scale(.78)}.search{height:52px;margin:14px 0}.browse-heading{margin-bottom:12px}.tool-card{min-height:212px;padding:17px 19px}.tool-visual{min-height:98px}.visual-pdf-merge,.visual-pdf-split,.visual-qr-code{transform:scale(.78)}.card-bottom h3{font-size:18px}footer{padding:18px 0 21px}@media(max-width:620px){.directory{padding:12px 0 26px}.directory-heading{min-height:140px;padding:20px}.directory h1{font-size:39px}.orbit-art{top:-100px;right:-118px;transform:rotate(-20deg) scale(.58)}.tool-card{min-height:175px}.tool-visual{min-height:77px}}
/* Unified PDF entry */
.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-card[data-tool=pdf-workspace]::before{background:radial-gradient(circle at 72% 42%,#8ca8a633,transparent 55%)}@media(max-width:620px){.tool-grid{grid-template-columns:1fr}}
.tool-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.visual-image-tools span:first-child{width:104px;height:74px;border:2px solid #b9ccc8;border-radius:10px;background:linear-gradient(150deg,#d9e6e0,#789994);transform:rotate(-8deg);box-shadow:0 13px 25px #14252b35}.visual-image-tools span:nth-child(2){width:44px;height:44px;border-radius:50%;background:#e2eee5;transform:translate(25px,-12px)}.visual-image-tools span:nth-child(3){width:102px;height:42px;background:#4f7773;clip-path:polygon(0 100%,35% 10%,55% 55%,75% 18%,100% 100%);transform:translate(0,18px) rotate(-8deg)}.visual-text-tools span:first-child{width:120px;height:91px;border:2px solid #bdccc8;border-radius:9px;background:repeating-linear-gradient(to bottom,#aac0bb 0 3px,transparent 3px 16px),#e0eae6;background-size:72px 70px;background-position:20px 20px;background-repeat:no-repeat;box-shadow:0 13px 25px #14252b35}.visual-text-tools span:nth-child(2){width:45px;height:7px;border-radius:10px;background:#6d9390;transform:translate(9px,-26px)}.visual-text-tools span:nth-child(3){width:62px;height:7px;border-radius:10px;background:#6d9390;transform:translate(0,22px)}.visual-developer-tools span:first-child{width:136px;height:88px;border:2px solid #bbccc8;border-radius:9px;background:linear-gradient(#86a4a1 0 18px,#273e44 18px);box-shadow:0 13px 25px #14252b55}.visual-developer-tools span:nth-child(2)::after{content:'{ }';color:#cde5d9;font-size:31px;font-weight:800}.visual-developer-tools span:nth-child(3)::after{content:'_';color:#98c1b6;font-size:31px;font-weight:800}.visual-developer-tools span:nth-child(3){transform:translate(36px,4px)}@media(max-width:900px){.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.tool-grid{grid-template-columns:1fr}}