:root{
  --green:#2f6b3b; --green-2:#5a8a55; --bg:#f7f5ef; --card:#ffffff; --text:#243024; --muted:#667366; --line:#dfe6dc;
}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;color:var(--text);background:var(--bg);line-height:1.7}
.container{width:min(760px,92vw);margin:0 auto}
.topbar{background:linear-gradient(180deg,var(--green),#274f31);color:#fff;padding:22px 0 18px}
.brand{font-size:14px;opacity:.9;letter-spacing:.08em}
h1{margin:8px 0 10px;font-size:30px;line-height:1.25}
.subtitle{margin:0;opacity:.95;font-size:16px}
main{padding:22px 0 42px}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px;margin:14px 0;box-shadow:0 4px 14px rgba(0,0,0,.04)}
.actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.action{display:block;text-decoration:none;background:#f2f7f1;color:var(--green);border:1px solid #d6e3d2;border-radius:14px;text-align:center;padding:14px 10px;font-weight:700}
.list a{display:block;text-decoration:none;color:var(--text);padding:14px;border:1px solid var(--line);border-radius:14px;margin:10px 0;background:#fff}
.kicker{font-size:13px;color:var(--green);font-weight:800;letter-spacing:.06em}
.section-title{margin:0 0 8px;font-size:21px}
.small{color:var(--muted);font-size:14px}
.note{background:#f6faf4;border-left:4px solid var(--green-2);padding:12px 14px;border-radius:12px}
.learning{background:#f9fbf7;border:1px dashed #c8d8c3}
footer{padding:24px 0 40px;color:var(--muted);font-size:14px}
.btn{display:inline-block;text-decoration:none;background:var(--green);color:#fff;padding:12px 16px;border-radius:12px;font-weight:700;margin-top:8px}
.back{display:inline-block;text-decoration:none;color:var(--green);font-weight:700;margin-bottom:10px}
ul{padding-left:20px}
ol{padding-left:22px}
@media (max-width:560px){h1{font-size:26px}.actions{grid-template-columns:1fr}}