:root{--paper:#f7f4ed;--sheet:#fffdf8;--ink:#242823;--muted:#63645c;--red:#923a2d;--edge:#cfcabd;--navy:#344e5e;color-scheme:light;font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;color:var(--ink);background:var(--paper);line-height:1.6}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:1rem}body{margin:0;min-height:100vh;display:flex;flex-direction:column}main{flex:1;width:100%}button,input{font:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #24658a;outline-offset:4px}[hidden]{display:none!important}.wrap{width:min(calc(100% - 96px),1192px);margin-inline:auto}.mast{border-bottom:1px solid var(--edge);background:#fbf9f3}.bar{height:76px;display:flex;align-items:center;justify-content:space-between}.logo{display:flex}.logo img{display:block;width:168px;height:auto;mix-blend-mode:multiply}.bar nav,.foot,.heading-group,.section-head,.card-top,.card-bottom{display:flex;align-items:center}.bar nav{gap:28px;font-size:14px;font-weight:650}.brand-button{display:inline-flex;align-items:center;gap:7px;min-height:42px;padding:8px 18px;background:var(--red);color:white;border-radius:4px;font-weight:700}.brand-button:hover{background:#732c22}.foot a:hover{text-decoration:underline;text-underline-offset:5px}
.hero{position:relative;display:grid;grid-template-columns:minmax(0,1.18fr) minmax(0,.9fr);align-items:center;gap:15px;padding:clamp(34px,4vw,60px) 0;border-bottom:1px solid #949387}.hero-copy{position:relative;z-index:1}.brandname{display:flex;align-items:center;gap:11px;font-weight:700;font-size:14px;letter-spacing:.14em;color:var(--red);margin:0 0 12px}.brandname>span{width:28px;height:2px;background:currentColor}.hero h1{font-family:"Noto Serif CJK TC","Noto Serif TC","Songti TC","PMingLiU",serif;letter-spacing:-.075em;font-size:clamp(46px,5.7vw,81px);line-height:1.16;margin:0;font-weight:900}.hero h1 span{color:var(--red)}.intro{font-size:clamp(15px,1.3vw,18px);line-height:1.8;color:#464a42;margin:18px 0 25px}.small-break{display:none}
.searchbox{display:flex;align-items:center;gap:12px;background:var(--sheet);max-width:520px;padding:5px 5px 5px 14px;border:1px solid #8e8f83;border-radius:5px}.searchbox:focus-within{border-color:var(--red);box-shadow:0 0 0 1px var(--red)}.searchbox svg{width:20px;flex:none;color:#73766c}.searchbox input{min-width:0;width:100%;background:none;border:0;color:var(--ink);font-size:15px;padding:5px 0;outline:0}.searchbox input:focus-visible{outline:0}.searchbox button{color:white;background:#29352f;border:0;border-radius:3px;padding:7px 18px;white-space:nowrap;min-height:38px;font-size:14px;font-weight:700}.searchbox button:hover{background:var(--red)}
#directory{padding:32px 0 54px}.section-head{justify-content:space-between;gap:12px}.heading-group{gap:12px}.heading-mark{width:5px;height:27px;background:var(--red)}h2,h3,p{margin-top:0}.heading-group h2,.card h3,dialog h2{font-family:"Noto Serif CJK TC","Noto Serif TC","Songti TC","PMingLiU",serif}.heading-group h2{font-size:30px;line-height:1.3;letter-spacing:.02em;margin:0}.count{font-size:13px;color:var(--muted);font-weight:600;white-space:nowrap}.guide-open,.secondary{border:1px solid #b9b8ab;border-radius:4px;background:transparent;color:var(--ink);min-height:39px;padding:6px 12px;font-size:14px;font-weight:650}.guide-open{display:flex;align-items:center;gap:6px}.guide-open:hover,.secondary:hover{background:#ebe8dc}.guide-open svg{width:18px;height:18px}.category-row{display:flex;gap:8px;flex-wrap:wrap;margin:21px 0 20px}.chip{display:inline-flex;align-items:center;gap:8px;padding:6px 13px;min-height:38px;background:transparent;color:#435047;border:1px solid #c9c7bb;border-radius:4px;font-size:14px;font-weight:650}.chip:hover{border-color:#656e61}.chip[aria-pressed=true]{background:#2c3730;border-color:#2c3730;color:#fff}.chip .num{font-size:12px;font-weight:500;opacity:.82}.selection{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:14px;margin:0 0 15px}.reset{background:transparent;color:var(--red);border:0;text-decoration:underline;text-underline-offset:3px;padding:5px}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px}.card{--accent:var(--red);--tint:#f5e7e1;position:relative;display:flex;flex-direction:column;border:1px solid var(--edge);border-top:3px solid var(--accent);background:var(--sheet);padding:22px 23px 15px;border-radius:4px;transition:transform .15s,border-color .15s,box-shadow .15s}.card.navy{--accent:#354f61;--tint:#e5ecec}.card.ochre{--accent:#84602c;--tint:#f6edd8}.card:hover,.card:focus-within{transform:translateY(-2px);border-color:var(--accent);box-shadow:0 4px 12px #3534240c}.card-top{justify-content:flex-start;gap:14px;margin-bottom:19px}.card-heading{min-width:0;display:grid;gap:3px}.iconbox{background:var(--tint);color:var(--accent);width:68px;height:68px;flex:none;display:grid;place-items:center;border-radius:9px}.iconbox svg{width:48px;height:48px}.category-name{font-size:12px;color:#575c52;font-weight:650;letter-spacing:.045em}.card h3{font-size:clamp(22px,1.98vw,28px);line-height:1.3;margin:0;letter-spacing:-.025em;text-wrap:balance}.card h3 a:after{content:"";position:absolute;inset:0}.question{font-size:15px;font-weight:700;margin:0 0 7px}.desc{color:var(--muted);font-size:14px;line-height:1.8;margin:0 0 20px}.card-bottom{border-top:1px solid #dedacf;justify-content:space-between;padding-top:12px;margin-top:auto;color:var(--accent);font-weight:700;font-size:14px}.arrow{font:22px/1 sans-serif}.noresults{border:1px dashed var(--edge);padding:30px;text-align:center}.noresults h3{margin-bottom:5px}.noresults p{color:var(--muted)}.pagination{display:flex;justify-content:center;align-items:center;gap:.75rem;padding-top:24px}.pagination button:disabled{opacity:.5;cursor:default}
footer{border-top:1px solid var(--edge)}.foot{padding:19px 0;justify-content:space-between;font-size:12px;color:#5f635b}.foot-sep{color:#b1ac9c;margin:0 5px}.skip{position:fixed;top:-100px;left:10px;z-index:9;padding:6px 12px;background:#fff}.skip:focus{top:8px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
dialog{background:var(--sheet);color:var(--ink);border:1px solid #928979;border-top:4px solid var(--red);border-radius:6px;padding:30px;width:min(90vw,480px);max-height:85dvh}dialog::backdrop{background:#232a25aa}dialog h2{margin:4px 0 16px;font-size:26px}.close{position:absolute;right:10px;top:8px;background:none;border:0;color:var(--ink);font-size:27px;min-width:40px}.need{display:flex;justify-content:space-between;align-items:center;text-align:left;background:transparent;border:0;border-top:1px solid var(--edge);width:100%;padding:13px 3px;color:var(--ink);font-weight:650}.need:hover{color:var(--red)}.need span{font-size:13px;color:var(--muted)}
@media(max-width:980px){.wrap{width:calc(100% - 54px)}.card{padding:17px 15px 14px}.cards{gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr))}}
@media(max-width:760px){.wrap{width:calc(100% - 36px)}.bar{height:60px}.logo img{width:132px}.bar nav{gap:15px;font-size:12px}.hero{grid-template-columns:minmax(0,1fr) minmax(0,.65fr);gap:5px;padding:27px 0}.hero h1{font-size:clamp(34px,6.3vw,52px)}.intro{font-size:14px;margin:10px 0 16px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.card{padding:18px}.card h3{font-size:23px}#directory{padding:24px 0 32px}.heading-group h2{font-size:26px}}
@media(max-width:560px){.hero{display:grid;grid-template-columns:minmax(0,1fr) 102px;align-items:center;column-gap:0;row-gap:14px}.hero-copy{display:contents}.hero .brandname{grid-column:1;grid-row:1;align-self:end;margin:0}.hero h1{grid-column:1;grid-row:2;font-size:clamp(33px,7.8vw,44px);white-space:nowrap}.intro{grid-column:1 / -1;grid-row:3;margin:0}.hero form{grid-column:1 / -1;grid-row:4}.cards{grid-template-columns:1fr}.brandname{font-size:12px}.heading-group{gap:8px}.heading-mark{height:22px;width:4px}.heading-group h2{font-size:24px}.guide-open{font-size:12px;padding:5px 8px;gap:4px}.category-row{gap:5px;margin:14px 0}.chip{font-size:13px;padding:5px 9px;gap:5px}.card{padding:15px 18px 12px}.card-top{gap:12px;margin-bottom:14px}.iconbox{width:58px;height:58px}.iconbox svg{width:41px;height:41px}.desc{margin-bottom:13px}.foot{gap:10px;font-size:12px;flex-wrap:wrap}.intro .small-break{display:none}.count{font-size:12px}}
@media(max-width:360px){.hero{grid-template-columns:minmax(0,1fr) 72px}.wrap{width:calc(100% - 26px)}.bar nav{gap:8px}.logo img{width:116px}.chip{padding:5px 7px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
.hero{padding:42px 0 35px;grid-template-columns:minmax(0,1.1fr) minmax(260px,.74fr);gap:clamp(20px,5vw,90px);border-bottom:1px solid var(--edge)}
.hero-copy{display:block}.hero h1{font-size:clamp(44px,5.5vw,72px)}.hero .intro{margin:13px 0 0}.hero form{align-self:center}.search-label{display:block;font-size:15px;margin-bottom:8px;color:var(--ink);font-weight:700;letter-spacing:.03em}.searchbox{max-width:none}.hero .brandname{margin-bottom:9px}.cards{margin-top:16px}
@media(max-width:760px){.hero{grid-template-columns:1fr;gap:20px;padding:28px 0 23px}.hero form{max-width:540px;width:100%}.search-label{font-size:14px;margin-bottom:5px}}
@media(max-width:560px){.hero{display:block}.hero-copy{display:block}.hero h1{font-size:clamp(36px,9vw,48px)}.hero form{margin-top:17px}.hero .intro{margin-top:9px}.cards{margin-top:12px}}