.sprite{position:absolute;width:0;height:0;overflow:hidden}:root{--paper:#fbf8f1;--paper-2:#f3ecdd;--soft:#e7e1d3;--ink:#3a2320;--muted:#6b5a52;--pink:#e9b6cf;--rose:#b0527c;--mustard:#ecc46e;--sky:#eef2cf;--peri:#b8c1ea;--sage:#c9d58f;--orange:#e69a4e;--f-body:"Noto Sans TC",ui-sans-serif,system-ui,sans-serif;--f-head:"LXGW WenKai TC","Noto Serif TC",serif;--f-display:"Gluten","LXGW WenKai TC",cursive}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-body);line-height:1.8;-webkit-text-size-adjust:100%}a{color:inherit}img{max-width:100%}.wrap{max-width:1120px;margin:0 auto;padding:0 max(16px,env(safe-area-inset-left))}h1,h2,h3{font-family:var(--f-head);line-height:1.3;font-weight:700}h1{font-size:clamp(32px,4.6vw,50px);margin:6px 0 10px;text-wrap:balance}.eyebrow{font-size:15px;color:var(--rose);font-weight:500}.lead{font-size:17px;color:var(--muted);max-width:720px}header.site{position:sticky;top:0;z-index:50;background:#fbf8f1f0;backdrop-filter:blur(6px);border-bottom:1px solid var(--soft)}header.site .wrap{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:68px;flex-wrap:wrap}.logo{display:flex;align-items:center;gap:8px;text-decoration:none;font-family:var(--f-head);font-weight:700;font-size:24px}.logo svg{width:30px;height:33px}nav.main{display:flex;gap:2px;flex-wrap:wrap}nav.main a{text-decoration:none;font-size:15px;padding:6px 12px;border-radius:999px}@media (max-width:640px){header.site .wrap{min-height:0;padding-top:8px;gap:2px}nav.main{flex-wrap:nowrap;overflow-x:auto;width:100%;padding-bottom:8px;scrollbar-width:none}nav.main a{white-space:nowrap;font-size:14px;padding:5px 11px}.logo{font-size:21px}}nav.main a:hover{background:var(--paper-2)}nav.main a[aria-current=page]{background:var(--ink);color:var(--paper)}main{padding:36px 0 80px}.btn{display:inline-flex;align-items:center;gap:8px;font:inherit;font-weight:700;text-decoration:none;padding:10px 20px;border-radius:999px;border:1.5px solid var(--ink);background:var(--ink);color:var(--paper);cursor:pointer}.btn.ghost{background:#fff;color:var(--ink)}.chip{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:14px;font-weight:700;padding:5px 14px;border-radius:999px;background:#fff;border:1.5px solid var(--ink);color:var(--ink);cursor:pointer;text-decoration:none}.chip[aria-pressed=true]{background:var(--ink);color:var(--paper)}.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}.card{background:#fff;border:1.5px solid var(--ink);border-radius:18px;overflow:hidden;text-decoration:none;display:flex;flex-direction:column;transition:transform .15s}.card:hover{transform:translateY(-3px)}.card>svg,.card>img{display:block;width:100%;height:auto;aspect-ratio:5/3;object-fit:cover;border-bottom:1.5px solid var(--ink);background:var(--sky)}.card-body{padding:14px 18px 18px;display:flex;flex-direction:column;gap:4px}.card .meta{font-size:12px;font-weight:700;letter-spacing:.5px;color:var(--rose)}.card h3{margin:0;font-size:20px}.card p{margin:0;color:var(--muted);font-size:14px}.demo-tag{align-self:flex-start;margin-top:6px;font-size:11px;font-weight:700;background:var(--paper-2);border-radius:999px;padding:0 8px;color:var(--muted)}.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0}.tile{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;font:inherit;color:var(--ink);background:#fff;border:1.5px solid var(--ink);border-left:8px solid var(--c,var(--sage));border-radius:14px;padding:14px 14px 12px;cursor:pointer;text-decoration:none;transition:transform .15s}.tile b{font-family:var(--f-head);font-size:19px}.tile span{font-size:13px;line-height:1.5}.tile small{margin-top:auto;padding-top:6px;font-size:12px;font-weight:700;color:var(--muted)}.tile:hover{transform:translateY(-2px)}.tile[aria-pressed=true]{background:var(--c,var(--sage));outline:2.5px solid var(--ink);outline-offset:2px}.tile.cont{border-left-width:1.5px;padding-top:10px}.tile.cont svg{width:100%;height:auto;display:block;margin-bottom:6px;background:#dfe5f6;border-radius:10px}.tile.cont[aria-pressed=true]{background:#c6d0ef}.tile.cont[aria-pressed=true] svg{background:#fff}@media (max-width:860px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}.search{width:100%;max-width:420px;font:inherit;font-size:15px;padding:10px 16px;border:1.5px solid var(--ink);border-radius:999px;background:#fff}.empty{border:1.5px dashed #c9bfa5;border-radius:16px;padding:22px;color:var(--muted);text-align:center}.empty a{font-weight:700;color:var(--ink)}.crumb{font-size:14px;margin-bottom:10px;color:var(--muted)}.crumb a{color:var(--ink)}.disclose{font-size:13px;background:var(--paper-2);border-radius:10px;padding:8px 12px;color:var(--muted)}footer.site{border-top:1px solid var(--soft);padding:26px 0 40px;font-size:14px;color:var(--muted)}footer.site .wrap{display:flex;gap:10px 22px;flex-wrap:wrap;justify-content:space-between}footer.site a{color:var(--ink)}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}