
:root{--ink:#462a20;--orange:#b0461d;--cream:#f8f4ed;--line:#e6ded2}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fefdf9;color:var(--ink);font:16px/1.6 Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button,.button{cursor:pointer;border:0;border-radius:7px;padding:12px 22px;background:var(--orange);color:white;font-weight:600;display:inline-block}button:hover,.button:hover{background:#8b3516}header{max-width:1200px;margin:auto;padding:18px 32px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px}.brand img{width:82px;height:75px;object-fit:contain}.brand strong{font: bold 23px Georgia,serif}.brand small{display:block;font-size:12px;color:#8b7669}nav{display:flex;gap:26px;font-size:14px}.preview{background:#efe5d6;text-align:center;font-size:12px;padding:6px 15px;letter-spacing:.4px}.hero{position:relative;overflow:hidden;background:#493b2b;min-height:510px;display:flex;align-items:center;color:white}.hero svg{position:absolute;right:0;top:0;width:100%;height:100%;object-fit:cover}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(34,27,20,.93),rgba(34,27,20,.70) 44%,rgba(34,27,20,.1))}.hero-content{position:relative;z-index:1;max-width:1200px;width:100%;margin:auto;padding:65px 32px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#ae562d}.hero .eyebrow{color:#f6c97b}h1{font:normal clamp(38px,5vw,62px)/1.1 Georgia,serif;max-width:560px;margin:20px 0}h2{font:normal 36px/1.2 Georgia,serif;margin:10px 0 16px}h3{font:normal 24px/1.3 Georgia,serif;margin:0 0 6px}.hero p{max-width:480px;color:#eadfd1;margin-bottom:26px}.hero .button{background:#f1ab32;color:#3c251a}.hero .textlink{margin-left:24px;font-size:14px;border-bottom:1px solid #af9d8c;padding-bottom:6px}.container{max-width:1200px;margin:auto;padding:64px 32px}.heading{display:flex;align-items:end;justify-content:space-between;gap:24px}.muted{color:#806f63;font-size:14px}.filters{display:flex;gap:12px;margin:28px 0 22px;flex-wrap:wrap}input,textarea,select{border:1px solid var(--line);border-radius:7px;padding:12px;background:#fff;color:var(--ink)}.filters input{flex:1;min-width:200px}.filters select{min-width:160px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card{border:1px solid var(--line);border-radius:12px;padding:24px;background:white}.card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.tag{font-size:11px;padding:4px 9px;border-radius:30px;background:#f7eee3;color:#92602e}.date{font-size:12px;color:#89776a}.place{font-size:14px;color:#806f63;margin:0 0 24px}.needs{padding:0;list-style:none;margin:0}.needs li{padding:12px 0;border-top:1px solid #eee7de;display:flex;justify-content:space-between;font-size:14px;gap:10px}.needs span{color:#947761;font-size:12px;white-space:nowrap}.card button{background:#f9f2e8;color:#a44b26;width:100%;margin-top:20px;font-size:13px}.near{background:#f4eadc}.near-inner{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.near p{color:#806f63;max-width:490px}.map{height:260px;background:#e7e6d7;border:8px solid #fffcf5;border-radius:16px;position:relative;overflow:hidden}.road{position:absolute;background:#fff9ed;width:140%;height:24px;transform:rotate(-25deg);top:110px;left:-40px}.road.two{transform:rotate(63deg);height:18px}.radius{position:absolute;inset:35px 80px;border:2px dashed #c09152;border-radius:50%;background:#efb94722;display:grid;place-items:center;color:#aa6c32;font-size:13px}.pin{position:absolute;font-size:28px;color:#b0461d;line-height:1}.pin.p1{left:34%;top:33%}.pin.p2{left:65%;top:58%}.pin.p3{left:49%;top:70%}.map small{position:absolute;bottom:10px;left:12px;color:#8e8071;font-size:10px}.near-actions{display:flex;gap:10px;flex-wrap:wrap}.secondary{background:white;color:var(--orange);border:1px solid #dccab6}#near-results{margin-top:20px;font-size:14px}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px}label{display:block;font-size:13px;font-weight:600;margin-bottom:6px}.field{margin-bottom:18px}.field input,.field textarea{width:100%}.field textarea{min-height:130px;resize:vertical}.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}.disclaimer{border-top:1px solid var(--line);background:#f8f4ed}.disclaimer .container{padding-top:35px;padding-bottom:35px;display:grid;grid-template-columns:230px 1fr;gap:40px}.disclaimer h3{font-size:21px}.disclaimer p{font-size:13px;color:#806f63;margin:0}footer{max-width:1200px;margin:auto;padding:23px 32px;display:flex;justify-content:space-between;font-size:12px;color:#927d6b}dialog{border:1px solid var(--line);border-radius:14px;max-width:500px;padding:30px;color:var(--ink)}dialog::backdrop{background:#24170b88}.empty{grid-column:1/-1;padding:30px;text-align:center;color:#806f63}@media(max-width:800px){header{padding:15px 20px}nav{gap:12px;font-size:12px}.brand small{display:none}.brand strong{font-size:18px}.brand img{width:58px}.hero-content,.container{padding:42px 20px}.cards{grid-template-columns:1fr}.near-inner,.contact-grid,.disclaimer .container{grid-template-columns:1fr;gap:26px}.heading{align-items:start;flex-direction:column;gap:0}.two-fields{grid-template-columns:1fr;gap:0}.hero .textlink{display:inline-block;margin-top:18px}.hero{min-height:470px}footer{gap:12px;flex-wrap:wrap}}
header{flex-wrap:wrap}nav{margin-left:auto}.language{display:flex;gap:3px;background:#f3eadd;border-radius:7px;padding:3px}.language button{padding:7px 10px;font-size:12px;background:transparent;color:#80513b}.language button[aria-pressed="true"]{background:#b0461d;color:white}.brand .ch-tagline{font-size:12px;letter-spacing:1px}.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 48%}.hero h1{max-width:600px}html[lang="zh-Hans"] h1{line-height:1.3;font-size:clamp(38px,4.5vw,58px)}html[lang="zh-Hans"] h2{line-height:1.4}@media(max-width:800px){.brand small{display:block;font-size:10px}.brand .ch-tagline{font-size:10px}header{gap:12px}nav{order:3;width:100%;justify-content:center}.language{margin-left:auto}.hero-photo{object-position:65% center}}
/* Sans-serif typography for English and Chinese. */
:root{--font-sans:"Segoe UI","Microsoft YaHei","PingFang SC","Noto Sans SC",Arial,sans-serif}
body,button,input,textarea,select{font-family:var(--font-sans)}
.brand strong{font-family:var(--font-sans);font-weight:700;letter-spacing:-.5px}
h1,h2,h3{font-family:var(--font-sans);font-style:normal;letter-spacing:-.035em}
h1{font-weight:650;line-height:1.12;font-size:clamp(38px,4.6vw,60px)}
h2{font-weight:600;line-height:1.2;font-size:34px}
h3{font-weight:600;line-height:1.35;font-size:22px;letter-spacing:-.02em}
.hero p{font-size:16px;line-height:1.7}.eyebrow{letter-spacing:1.5px}
#contact>div>p:last-child{font-family:var(--font-sans)!important;font-style:normal!important;font-size:20px!important;line-height:1.7}
html[lang="zh-Hans"] h1{font-size:clamp(38px,4.4vw,56px);font-weight:600;line-height:1.35;letter-spacing:0}
html[lang="zh-Hans"] h2,html[lang="zh-Hans"] h3{letter-spacing:0}
@media(max-width:800px){h2{font-size:30px}.brand strong{font-size:18px}.hero h1{font-size:38px}}

/* Warm community design refinement. */
:root{--ink:#583b2e;--orange:#ad512f;--cream:#fff7eb;--line:#eadaca}
body{background:#fffbf4;color:var(--ink)}
.preview{background:#f1dfc6;color:#785134;letter-spacing:.2px}
header{padding-top:20px;padding-bottom:20px;background:#fffbf4}
.brand strong{color:#77442b;font-weight:650}.brand small{color:#987055}
nav a{color:#79543e}nav a:hover{color:#b0461d}.language{background:#f4e4cf}
.hero{min-height:530px;border-radius:0 0 30px 30px}
.hero:after{background:linear-gradient(90deg,rgba(65,37,22,.87),rgba(77,46,26,.66) 40%,rgba(75,42,19,.12) 78%)}
.hero-photo{filter:sepia(.12) saturate(.92) brightness(1.08)}
h1{font-weight:550;letter-spacing:-.025em;line-height:1.18;font-size:clamp(38px,4.4vw,57px)}
h2{color:#744830;font-weight:550;letter-spacing:-.025em}
h3{font-weight:550;color:#744830}
.hero p{color:#fff0dc}.hero .eyebrow{color:#ffd798;letter-spacing:1.3px}
.hero .button{background:#f3b85c;color:#553419;border-radius:28px;padding:14px 25px;box-shadow:0 5px 18px #29160924}
.hero .textlink{color:#fff0dc;border-color:#d8bda1}
.eyebrow{color:#b36c45;font-weight:600;letter-spacing:1.3px}
.container{padding-top:70px;padding-bottom:70px}
#resources{background:radial-gradient(ellipse at 15% 0%,#fbedda 0%,transparent 55%)}
.filters input,.filters select{background:#fffdf8;border-color:#e5d2bd;border-radius:12px}
.card{background:#fffdf8;border-color:#ebdbc8;border-radius:20px;padding:26px;box-shadow:0 7px 25px rgba(111,71,38,.045);transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(111,71,38,.09)}
.card:nth-child(3n+1){border-top:4px solid #dfaa72}.card:nth-child(3n+2){border-top:4px solid #a8b49a}.card:nth-child(3n){border-top:4px solid #d9987f}
.tag{background:#f5e6d2;color:#8e603b}.card:nth-child(3n+2) .tag{background:#edf0e3;color:#617052}.card:nth-child(3n) .tag{background:#fae8df;color:#a05b40}
.needs li{border-color:#f0e5d6}.card button{border-radius:25px;background:#f7e8d5;color:#955031;font-weight:600}.card button:hover{background:#efdbc0}
.muted,.place{color:#8f7562}.near{background:#f5e5d0;border-radius:30px;margin:0 24px}
.near p{color:#83644e}.near button{border-radius:25px}.secondary{background:#fff9ef;border-color:#dec4a6}
.map{background:#e2e5d5;border:10px solid #fffbf2;border-radius:24px;box-shadow:0 10px 25px #7251370b}
.radius{border-color:#bc8c56;background:#f6c86b25}.road{background:#fff9ed}
#contact{background:radial-gradient(ellipse at 90% 65%,#f9ead9 0%,transparent 65%)}
#contact-form{background:#fffdf8;padding:30px;border:1px solid #ecddca;border-radius:22px;box-shadow:0 8px 30px #78553606}
#contact-form input,#contact-form textarea{background:#fffcf6;border-color:#e6d5c0;border-radius:11px}
#contact-form button{border-radius:25px;background:#ae5839}
.disclaimer{background:#f1e3d1;border-color:#e9d6bd}.disclaimer p{color:#80614c}footer{color:#9a795f}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #cc9865;outline-offset:3px}
@media(max-width:800px){.near{margin:0 10px;border-radius:22px}.container{padding-top:46px;padding-bottom:46px}.hero{min-height:490px;border-radius:0 0 22px 22px}.hero h1{font-size:38px;font-weight:550}#contact-form{padding:22px}}

/* Palette drawn from the approved Bridge of Care logo. */
:root{--ink:#66220c;--orange:#b0461d;--cream:#fefdf9;--line:#efdbc9;--amber:#f1ab32;--coral:#ea7e5a}
body,header{background:#fefdf9;color:#66220c}.preview{background:#fcebcf;color:#66220c}
.brand strong{color:#66220c}.brand small{color:#8a4a30}nav a{color:#66220c}nav a:hover{color:#b0461d}
.language{background:#fbe8d6}.language button{color:#66220c}.language button[aria-pressed="true"]{background:#b0461d;color:#fefdf9}
h2,h3{color:#66220c}.eyebrow{color:#b0461d}
.hero:after{background:linear-gradient(90deg,rgba(75,29,10,.86),rgba(83,39,17,.62) 40%,rgba(102,34,12,.09) 78%)}
.hero .eyebrow{color:#fbd391}.hero p,.hero .textlink{color:#fff4e3}.hero .textlink{border-color:#ea7e5a}
.hero .button{background:#f1ab32;color:#66220c}.hero .button:hover{background:#f7bc59}
#resources{background:radial-gradient(ellipse at 15% 0%,#fdf0db 0%,transparent 60%)}
.filters input,.filters select{border-color:#efd8c1;background:#fefdf9}
.card{background:#fefdf9;border-color:#efdccc;box-shadow:0 7px 25px rgba(102,34,12,.04)}
.card:nth-child(3n+1){border-top-color:#f1ab32}.card:nth-child(3n+2){border-top-color:#ea7e5a}.card:nth-child(3n){border-top-color:#b0461d}
.tag,.card:nth-child(3n+1) .tag{background:#fff0d5;color:#854615}.card:nth-child(3n+2) .tag{background:#fde9e0;color:#97401e}.card:nth-child(3n) .tag{background:#f7e2d8;color:#873617}
.card button{background:#fcebd7;color:#b0461d}.card button:hover{background:#f9dcb8}
.needs li{border-color:#f2e1d4}.needs span{color:#8b553b}.date,.muted,.place{color:#875842}
.near{background:#fcebd7}.near p{color:#80503a}.near button{background:#b0461d;color:#fefdf9}.near .secondary{background:#fefdf9;color:#b0461d;border-color:#e9bc9f}
.map{background:#f9e3c4;border-color:#fefdf9}.road{background:#fefdf9}.radius{border-color:#ea7e5a;background:#f1ab3224;color:#b0461d}.pin{color:#b0461d}.map small{color:#875842}
#contact{background:radial-gradient(ellipse at 90% 65%,#fdece3 0%,transparent 65%)}
#contact-form{background:#fefdf9;border-color:#efdbc9}#contact-form input,#contact-form textarea{background:#fffaf2;border-color:#ebd2bd}#contact-form button{background:#b0461d}
#contact>div>p:last-child{color:#b0461d!important}
.disclaimer{background:#f9e6d8;border-color:#eec7af}.disclaimer p{color:#80503a}footer{color:#875842}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline-color:#f1ab32}

.hero-brand{display:flex;align-items:center;gap:18px;margin-bottom:18px}.hero-logo{width:90px;height:90px;object-fit:contain;background:#fefdf9;border-radius:16px;padding:5px;box-shadow:0 5px 18px #35170824}.hero-content{padding-top:38px;padding-bottom:38px}.hero h1{margin-top:14px}@media(max-width:800px){.hero-logo{width:72px;height:72px;border-radius:12px}.hero-brand{gap:12px}.hero-brand .eyebrow{max-width:190px;font-size:11px}.hero-content{padding-top:30px;padding-bottom:30px}}

.hero-logo{background:transparent;padding:0;border-radius:0;box-shadow:none}

.hero-logo{width:112px;height:112px;filter:drop-shadow(.6px 0 0 #fff) drop-shadow(-.6px 0 0 #fff) drop-shadow(0 .6px 0 #fff) drop-shadow(0 -.6px 0 #fff)}
@media(max-width:800px){.hero-logo{width:90px;height:90px}}

.hero-logo{filter:none}

dialog{width:min(640px,calc(100vw - 32px));max-width:640px;max-height:90vh;overflow-y:auto}.help-map{margin:18px 0 8px;border-radius:14px;overflow:hidden;border:1px solid #efdbc9;background:#fcebd7}.help-map iframe{display:block;width:100%;height:250px;border:0}.map-link{color:#b0461d;text-decoration:underline;font-size:14px;font-weight:600}

.google-near-map{height:360px;position:relative}.google-near-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;pointer-events:none}.map-start{padding:55px 30px;text-align:center;color:#875842}.map-markers{position:absolute;inset:0;pointer-events:none}.map-marker{position:absolute;transform:translate(-50%,-50%);width:28px;height:28px;border:2px solid #fff;border-radius:50%;padding:0;background:#b0461d!important;color:white!important;font-size:12px;pointer-events:auto;box-shadow:0 2px 5px #0003}.user-marker{position:absolute;transform:translate(-50%,-50%);width:14px;height:14px;border:3px solid white;border-radius:50%;background:#357be5;box-shadow:0 1px 5px #0005}.map-circle{position:absolute;border:2px dashed #b0461d;background:#f1ab3218;border-radius:50%;transform:translate(-50%,-50%)}.map-caption{font-size:12px!important;margin-bottom:5px}.map-link[hidden]{display:none}

.tag{display:inline-flex;align-items:center;gap:6px}.category-icon{width:17px;height:17px;flex-shrink:0}

.category-icon{width:28px;height:28px}.tag{padding:4px 10px 4px 5px;gap:7px}

.category-art{display:inline-block;width:46px;height:46px;flex-shrink:0;background-image:url("category-illustrations-taiwan.png");background-size:300% 100%;background-position:var(--art-position) center;background-repeat:no-repeat}.tag{padding:3px 10px 3px 2px;gap:5px;border-radius:16px}

.disclaimer .money-disclaimer{grid-column:2;font-weight:600;margin-top:-22px;color:#66220c}@media(max-width:800px){.disclaimer .money-disclaimer{grid-column:1;margin-top:0}}

.resource-detail{display:block;color:#875842;font-size:12px}.honeypot{position:absolute;left:-9999px}.live-map{height:360px;min-width:0}.contact-privacy{font-size:12px}.map-status{padding:30px;text-align:center}
/* Area browsing uses the approved warm surfaces and existing card styles. */
.area-filters{align-items:end}.area-filters .field{margin:0;flex:1;min-width:180px}.area-filters select{width:100%}.area-filters label{font-size:14px}.area-inner>p{max-width:760px}.card .map-link{display:block;text-align:center;margin-top:12px;color:var(--orange);font-weight:600}.area-filters button{min-height:50px}.area-filters select:disabled{opacity:.65}
