:root{color-scheme:light;font-family:Arial,"Noto Sans TC",sans-serif;color:#293d3d;background:#f5f2eb}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:5px}header{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:25px 5vw;border-bottom:1px solid #d8d8cb}header>a{text-decoration:none;letter-spacing:.14em;font-size:14px}nav{display:flex;gap:22px;font-size:14px}main{max-width:1500px;margin:auto;padding:0 5vw}.intro{padding:70px 0 45px}.eyebrow{font-size:11px;letter-spacing:.14em;color:#6a7770}h1{font-size:clamp(40px,5.5vw,76px);font-weight:400;line-height:1.22;margin:22px 0 25px;letter-spacing:.05em}h1 em{font-style:normal;color:#6b826f}.intro>p:not(.eyebrow){font-size:18px}.intro .note{font-size:14px!important;color:#6a7470}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.actions a,.download{padding:12px 18px;border:1px solid #516b5b;font-size:13px;text-decoration:none}.actions a:first-child,.download{background:#3d5b4d;color:white}.filters{display:flex;align-items:end;gap:20px;border-top:1px solid #c9cebf;padding:25px 0}.filters label{display:grid;gap:9px;font-size:12px}input,select{font:inherit;border:1px solid #c8cfc6;background:#fffdf9;padding:12px;color:#293d3d}input{width:260px}#count{font-size:13px;margin-left:auto;padding-bottom:12px}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px 24px}.card{background:transparent;border:0;padding:0;text-align:left;color:inherit;cursor:pointer;font:inherit}.image-wrap{height:225px;background:#e9e8df;display:flex;justify-content:center;align-items:center;padding:17px;transition:background .2s}.card:hover .image-wrap{background:#dce3d7}.card img{max-width:100%;max-height:100%;object-fit:contain;box-shadow:0 5px 13px #23382a1a}.card h2{font-size:17px;font-weight:400;margin:13px 0 7px}.card p{font-size:11px;letter-spacing:.04em;color:#6b7770;margin:0}.usage{border-top:1px solid #c9cebf;margin:60px 0;padding:30px 0;max-width:850px}.usage h2{font-size:21px;font-weight:400}.usage p{line-height:1.9;font-size:14px}footer{padding:30px 5vw;border-top:1px solid #d8d8cb;font-size:10px;letter-spacing:.13em}dialog{border:0;padding:24px;max-width:1100px;width:92vw;background:#f9f7f0;color:#293d3d}dialog::backdrop{background:#1c2b29c9}#close{display:block;margin:0 0 20px auto;background:transparent;border:0;padding:10px;cursor:pointer}.detail-layout{display:grid;grid-template-columns:1.3fr 1fr;gap:30px}.detail-layout>img{width:100%;height:65vh;object-fit:contain;background:#e9e8df}.detail-layout h2{font-weight:400;font-size:29px}#description{line-height:1.8}dl{display:grid;grid-template-columns:95px 1fr;gap:13px;font-size:13px}dt{color:#6b7770}dd{margin:0;overflow-wrap:anywhere}.download{display:inline-block;margin-top:15px}button:focus-visible,a:focus-visible{outline:3px solid #c89a50;outline-offset:4px}@media(max-width:1000px){.grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:700px){header{align-items:start}nav{gap:12px;flex-direction:column}.intro{padding-top:40px}.grid{grid-template-columns:repeat(2,1fr);gap:25px 12px}.image-wrap{height:180px;padding:10px}.filters{flex-wrap:wrap;gap:12px}input{width:200px}#count{margin-left:0}.detail-layout{grid-template-columns:1fr}.detail-layout>img{height:40vh}.actions a{font-size:12px}}@media(max-width:390px){.grid{grid-template-columns:1fr}.image-wrap{height:240px}}