:root{--ink:#20342f;--muted:#586d64;--green:#246e61;--red:#c64a39;--paper:#fffdf8;--cream:#f7f1e6;--line:#d8e1d7;font-family:system-ui,-apple-system,BlinkMacSystemFont,"PingFang TC","Noto Sans TC","Microsoft JhengHei",sans-serif;color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--cream);color:var(--ink);font-size:18px;line-height:1.85}a{color:var(--green);text-underline-offset:4px}a:hover{color:var(--red)}button{font:inherit}button,a{-webkit-tap-highlight-color:transparent}:focus-visible{outline:3px solid var(--red);outline-offset:4px}
.learn-wrap{width:min(1140px,calc(100% - 40px));margin:auto}.learn-header{background:var(--paper);border-bottom:1px solid var(--line)}.learn-nav{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:80px}.learn-brand{font-weight:900;font-size:20px;text-decoration:none;white-space:nowrap}.learn-brand span{display:inline-grid;place-items:center;width:39px;height:39px;margin-right:9px;border-radius:13px;color:white;background:var(--red)}.learn-nav-links{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:15px;font-weight:750}.learn-nav-links a{text-decoration:none}.learn-nav-links [aria-current=page]{text-decoration:underline}
.learn-intro{padding:42px 0 36px}.breadcrumbs{font-size:14px;margin:0 0 22px;color:var(--muted)}.breadcrumbs span{padding:0 8px}.learn-kicker{color:var(--green);font-size:15px;font-weight:850;letter-spacing:.06em}h1,h2,h3{line-height:1.35;letter-spacing:-.02em}h1{max-width:900px;margin:10px 0 20px;font-size:clamp(32px,5.5vw,54px)}.learn-lead{max-width:820px;font-size:21px;color:var(--muted);margin:0 0 18px}.learn-meta{font-size:14px;color:var(--muted);margin:12px 0 0}.learn-actions{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0}.learn-button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:8px 17px;border:1px solid var(--green);border-radius:13px;text-decoration:none;font-weight:800;background:var(--paper);color:var(--green)}.learn-button-primary{background:var(--green);color:white}.learn-button-primary:hover{background:#174e44;color:white}
.learn-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:34px;align-items:start;padding-bottom:60px}.learn-toc{position:sticky;top:20px;border:1px solid var(--line);border-radius:16px;padding:15px 18px;background:var(--paper);font-size:15px}.learn-toc summary{font-weight:850}.learn-toc ol{padding-left:21px;margin:10px 0 0}.learn-toc li{margin:8px 0}.learn-toc a{text-decoration:none}.learn-article{min-width:0}.learn-section{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:28px 30px;margin-bottom:22px}.learn-section h2{font-size:28px;margin:0 0 16px}.learn-section h3{font-size:21px;margin:25px 0 9px}.learn-section p{margin:12px 0}.learn-section li{margin:8px 0}.learn-section ul,.learn-section ol{padding-left:23px}.learn-section>:last-child{margin-bottom:0}
.learn-note{background:#edf4ed;border-left:4px solid var(--green);padding:13px 17px;border-radius:0 12px 12px 0}.learn-caution{background:#fff2e1;border-left-color:#b37a30}.learn-table-wrap{overflow:auto}.learn-table{width:100%;border-collapse:collapse;min-width:520px;font-size:16px;text-align:left}.learn-table th{background:#edf4ed;color:var(--green)}.learn-table th,.learn-table td{padding:12px;border:1px solid var(--line);vertical-align:top}.learn-table th:first-child{min-width:75px}.learn-table caption{text-align:left;color:var(--muted);margin-bottom:10px}
.demo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.demo-card{padding:18px;border:1px solid var(--line);border-radius:16px;background:#fbf7ec}.demo-card h3{margin:0 0 8px}.demo-card p{font-size:16px}.demo-board{width:100%;max-width:360px;display:block;margin:10px auto}.demo-controls{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0 8px}.demo-controls button{cursor:pointer;min-height:44px;border:1px solid var(--green);border-radius:10px;padding:7px 11px;background:white;color:var(--green);font-size:15px;font-weight:750}.demo-controls [aria-pressed=true]{background:var(--green);color:white}.demo-result{min-height:90px;font-size:15px;color:var(--ink)}.demo-legend{font-size:14px!important;color:var(--muted)}
.learn-questions details{border-top:1px solid var(--line);padding:15px 0}.learn-questions details:last-child{padding-bottom:0}.learn-questions summary{font-weight:800;cursor:pointer;line-height:1.65}.learn-questions p{font-size:17px}.learn-links{display:flex;flex-wrap:wrap;gap:12px 22px}.learn-footer{background:#e6eee5;border-top:1px solid var(--line);padding:26px 0;font-size:14px}.learn-footer nav{display:flex;flex-wrap:wrap;gap:8px 20px;margin:12px 0}.learn-footer p{margin:8px 0}.learn-single{max-width:850px}.learn-single .learn-section{margin-top:24px}
@media(max-width:850px){.learn-layout{grid-template-columns:1fr;gap:20px}.learn-toc{position:static}.learn-toc ol{display:flex;flex-wrap:wrap;gap:4px 30px;margin-bottom:0}.learn-toc li{margin:4px 0}.learn-nav{flex-wrap:wrap;gap:12px;padding:18px 0}.learn-nav-links{gap:7px 16px}.learn-intro{padding-top:28px}}
@media(max-width:600px){body{font-size:17px}.learn-wrap{width:calc(100% - 28px)}.learn-brand{font-size:18px}.learn-nav-links{font-size:14px}.learn-lead{font-size:18px}.learn-section{padding:22px 18px;border-radius:16px}.learn-section h2{font-size:25px}.learn-section h3{font-size:20px}.demo-grid{grid-template-columns:1fr}.demo-result{min-height:0}.learn-toc ol{display:block}.learn-table{font-size:15px}.learn-table th,.learn-table td{padding:9px}.learn-actions .learn-button{font-size:16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}