@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;700;900&family=DM+Serif+Display&display=swap');
.download-link{border-radius:20px;background:var(--green);color:white;padding:9px 14px;font-size:12px;font-weight:700;white-space:nowrap}.download-link:hover{background:#194d44}
.download-link{border:1px solid var(--green);border-radius:22px;padding:9px 13px;background:var(--green);color:white;font-size:12px;font-weight:700;white-space:nowrap}.download-link:hover{background:#1d5149}
:root{--ink:#203b3b;--muted:#718180;--cream:#f7f5ee;--paper:#fffefa;--green:#28665b;--orange:#e68252;--line:#e5e8df;--yellow:#f2bd4c}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'Noto Sans TC',sans-serif}a{color:inherit;text-decoration:none}.topbar{min-height:76px;padding:0 max(calc((100vw - 1180px)/2),6vw);display:flex;align-items:center;justify-content:space-between;background:var(--paper);border-bottom:1px solid var(--line);gap:20px}.brand{font-weight:900;letter-spacing:.04em;font-size:19px;display:flex;align-items:center;gap:10px;white-space:nowrap}.brand i{width:34px;height:34px;border-radius:50%;background:var(--green);color:white;display:grid;place-items:center;font-style:normal;font-size:18px}.nav{display:flex;gap:24px;color:#647674;font-size:14px}.nav a:hover,.nav a.active{color:var(--green);font-weight:700}.note-link{border:1px solid #cad6ce;border-radius:22px;padding:9px 16px;color:var(--green);font-size:13px;font-weight:700;white-space:nowrap}.note-link b{background:var(--green);color:#fff;padding:2px 7px;border-radius:12px;margin-left:5px}.hero{max-width:1180px;margin:0 auto;padding:62px 0 48px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:50px}.eyebrow{font-size:12px;color:var(--green);font-weight:700;letter-spacing:.16em}.hero h1{font-size:clamp(40px,5.2vw,68px);line-height:1.25;letter-spacing:-.04em;margin:17px 0 16px;font-weight:900}.hero h1 em{font-family:'DM Serif Display',serif;color:var(--orange);font-weight:400;font-style:normal}.hero p{color:var(--muted);line-height:1.9;font-size:15px;max-width:480px}.primary{display:inline-block;background:var(--green);color:white;padding:13px 22px;border-radius:28px;font-weight:700;font-size:14px;margin-top:10px}.hero-art{height:310px;border-radius:8px 100px 8px 8px;position:relative;overflow:hidden;background:linear-gradient(170deg,#a5c4b7 0 27%,#dce5d8 27% 45%,#88a99a 45% 58%,#efb36e 58% 60%,#4f7b78 60% 100%)}.hero-art:before{content:'';position:absolute;bottom:-55px;left:8%;width:350px;height:230px;border-radius:50%;background:#f1d69e;transform:rotate(-14deg)}.sun{position:absolute;right:16%;top:14%;width:70px;height:70px;background:#f4c271;border-radius:50%}.island{position:absolute;right:6%;bottom:35%;width:130px;height:125px;background:#527b70;border-radius:70% 45% 0 0;transform:rotate(12deg)}.wave{position:absolute;bottom:0;left:0;right:0;height:31%;background:repeating-linear-gradient(173deg,#397275 0 3px,#477f7d 3px 8px,#639491 8px 11px)}.boat{position:absolute;left:20%;bottom:19%;font-size:42px}.art-label{position:absolute;bottom:18px;right:23px;color:white;font-size:11px;letter-spacing:.18em}.section{max-width:1180px;margin:0 auto;padding:28px 0 70px}.section-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:25px}.section h2{font-size:29px;margin:6px 0 0;letter-spacing:-.03em}.section-intro{color:var(--muted);font-size:13px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:19px}.card{border-radius:9px;background:var(--paper);overflow:hidden;border:1px solid #edf0e9;transition:transform .2s,box-shadow .2s}.card:hover{transform:translateY(-3px);box-shadow:0 12px 28px #284b3b12}.cover{height:160px;position:relative;display:grid;place-items:center;overflow:hidden}.cover:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#172c2b38,transparent 55%)}.cover-icon{font-size:56px;position:relative;z-index:1}.cover-tag{position:absolute;left:13px;top:13px;background:#fffdf0e8;color:var(--green);padding:5px 9px;border-radius:15px;font-size:10px;font-weight:700;z-index:2}.save{position:absolute;right:12px;top:11px;z-index:2;border:0;background:#ffffffed;width:36px;height:36px;border-radius:50%;color:#89918a;font-size:22px;cursor:pointer}.save.saved{color:var(--yellow)}.card-body{padding:16px 17px 17px}.card-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.card h3{font-size:17px;margin:0;font-weight:700}.area{font-size:11px;color:#84908a;white-space:nowrap}.rating{font-size:11px;color:#bb8732;margin:9px 0}.tip{color:#9aa49d}.reason{font-size:12px;color:#697b76;line-height:1.7;min-height:42px}.meta{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #edf0e9;padding-top:11px;margin-top:12px;font-size:11px;color:#778681}.meta strong{color:var(--green);font-weight:500}.notebook{max-width:1180px;margin:0 auto;padding:68px 0 80px}.notebook-box{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:28px 32px}.note-heading{display:flex;justify-content:space-between;align-items:center}.note-heading h2{margin:3px 0 0;font-size:24px}.note-heading p{font-size:12px;color:var(--muted);margin:5px 0}.clear{border:0;background:none;color:#87928b;cursor:pointer}.empty{padding:27px 0 9px;color:#9aa49d;font-size:13px;text-align:center}.note-list{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding-top:20px}.note-item{border:1px solid #e6ebe4;border-radius:7px;padding:11px 13px;display:flex;justify-content:space-between;align-items:center;font-size:13px}.note-item small{display:block;color:#829089;font-size:10px;margin-top:3px}.remove{border:0;background:none;color:#999;cursor:pointer;font-size:18px}.transport{background:#e9efe8;padding:52px max(calc((100vw - 1180px)/2),6vw) 57px}.transit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.transit{background:#fffefa;border-radius:8px;padding:19px}.transit-icon{font-size:23px}.transit h3{font-size:14px;margin:10px 0 7px}.transit p{font-size:12px;color:#71817c;line-height:1.7;margin:0}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,20px);background:#203b3b;color:white;border-radius:24px;padding:11px 18px;font-size:12px;opacity:0;transition:.25s;pointer-events:none;z-index:5}.toast.show{opacity:1;transform:translate(-50%,0)}.page-intro{max-width:1180px;margin:0 auto;padding:45px 0 20px}.page-intro h1{font-size:38px;margin:9px 0}.page-intro p{color:var(--muted);font-size:14px;line-height:1.8}.transport-content{max-width:1180px;margin:0 auto;padding:50px 0}.transport-content h2{font-size:26px}.transport-content .transit-grid{margin:20px 0 50px}.route{background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:18px 20px;margin:10px 0;color:#63746f;font-size:13px;line-height:1.8}footer{background:#203b3b;color:#d3ded6;padding:23px 6vw;text-align:center;font-size:11px;letter-spacing:.08em}@media(max-width:1250px){.hero,.section,.notebook,.page-intro,.transport-content{margin-left:6vw;margin-right:6vw}}@media(max-width:850px){.topbar{padding:14px 5vw;flex-wrap:wrap}.nav{order:3;width:100%;justify-content:space-between;gap:10px;font-size:12px}.hero{margin:0 6vw;display:block;padding:40px 0}.hero-art{height:240px;margin-top:25px}.cards{grid-template-columns:repeat(2,1fr)}.transit-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.cards{grid-template-columns:1fr}.section-head{align-items:start;flex-direction:column;gap:8px}.cover{height:185px}.note-list{grid-template-columns:1fr}.notebook-box{padding:22px 17px}.page-intro h1{font-size:31px}.transit-grid{grid-template-columns:1fr 1fr}.section h2{font-size:25px}}