/* Site navigation. Light only. */
:root{color-scheme:light}
nav.nf{--nf-bar:#2a2523;--nf-fg:#f3ead9;--nf-card:#fffaf0;--nf-ink:#2a2523;--nf-muted:#6b5f55;--nf-line:#e3d3b8;--nf-soft:#efe2c8;--nf-rust:#af5205;--nf-rust-text:#8f4304;
 position:sticky;top:14px;z-index:60;box-sizing:border-box;margin:14px auto 0;width:max-content;max-width:calc(100% - 24px);display:flex;align-items:center;gap:2px;
 background:var(--nf-bar);color:var(--nf-fg);border-radius:999px;padding:7px 8px;box-shadow:0 18px 40px -16px rgba(0,0,0,.45);
 font:400 1rem/1.5 "PingFang TC","Noto Sans TC",system-ui,-apple-system,"Segoe UI",sans-serif;text-align:left;letter-spacing:normal}
nav.nf *{box-sizing:border-box;margin:0;max-width:none}
nav.nf a{color:inherit;text-decoration:none;border:0}
nav.nf .nf-home{display:block;flex:none;border-radius:50%;margin-right:6px}
nav.nf .nf-home img{display:block;width:36px;height:36px;border-radius:50%;background:#fff}
nav.nf .nf-panel{display:flex;align-items:center;gap:2px}
nav.nf .nf-top{display:block;min-height:40px;padding:9px 15px;border:0;border-radius:999px;background:none;color:inherit;font:inherit;font-size:.92rem;line-height:1.5;white-space:nowrap;cursor:pointer;box-shadow:none}
nav.nf .nf-top:hover,nav.nf .nf-has.nf-open>.nf-top{background:rgba(255,255,255,.14)}
nav.nf .nf-has>.nf-top::after{content:"";display:inline-block;width:0;height:0;margin-left:8px;vertical-align:middle;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid currentColor}
nav.nf :is(a,button):focus-visible{outline:2px solid #fff;outline-offset:2px}
nav.nf .nf-card :is(a,button):focus-visible{outline-color:var(--nf-rust)}
nav.nf .nf-menu{position:absolute;left:50%;top:100%;transform:translateX(-50%);width:min(760px,calc(100vw - 32px));padding-top:10px;display:none}
nav.nf .nf-has.nf-open>.nf-menu{display:block}
nav.nf .nf-card{display:grid;grid-template-columns:1fr 1fr;background:var(--nf-card);color:var(--nf-ink);border:1px solid var(--nf-line);border-radius:20px;box-shadow:0 18px 40px -20px rgba(60,35,10,.4);overflow:hidden}
nav.nf .nf-col{padding:16px 18px;min-width:0}
nav.nf .nf-col+.nf-col{border-left:1px solid var(--nf-line);background:var(--nf-soft)}
nav.nf .nf-h{font-size:.82rem;font-weight:700;line-height:1.4;letter-spacing:.08em;color:var(--nf-muted);margin-bottom:8px}
nav.nf .nf-h b{color:var(--nf-rust-text)}
nav.nf .nf-col ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:2px}
nav.nf .nf-col li{display:block;padding:0;margin:0}
nav.nf .nf-col li::before{content:none}
nav.nf .nf-row{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:40px;padding:7px 8px;border-radius:10px;font-size:.95rem;line-height:1.45;color:var(--nf-ink)}
nav.nf a.nf-row:hover{background:rgba(175,82,5,.1)}
nav.nf .nf-row b{font-weight:600}
nav.nf .nf-row small{display:block;color:var(--nf-muted);font-size:.78rem;line-height:1.4}
nav.nf .nf-tag{flex:none;border-radius:999px;padding:1px 9px;font-size:.72rem;font-weight:600;line-height:1.6;white-space:nowrap;background:var(--nf-card);color:var(--nf-muted);border:1px solid var(--nf-line)}
nav.nf .nf-foot{grid-column:1/-1;border-top:1px solid var(--nf-line);padding:10px 18px;font-size:.85rem;line-height:1.5;color:var(--nf-muted)}
nav.nf .nf-lang{padding:0 10px;font-size:.82rem;white-space:nowrap}
nav.nf .nf-lang a{display:inline;padding:0;margin:0;min-width:0;min-height:0;background:none}
nav.nf .nf-lang a[aria-current]{font-weight:700;text-decoration:underline;text-underline-offset:3px}
nav.nf .nf-login{display:block;margin-left:6px;padding:9px 18px;border-radius:999px;background:var(--nf-rust);color:#fff;font-size:.92rem;font-weight:600;white-space:nowrap}
nav.nf .nf-toggle{display:none}
@media(max-width:900px){
 nav.nf{width:calc(100% - 24px);flex-wrap:wrap;justify-content:space-between}
 nav.nf .nf-toggle{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;margin-left:auto;padding:0 14px;border:0;border-radius:999px;background:#fff;color:var(--nf-ink);font:inherit;font-size:1.05rem;cursor:pointer}
 nav.nf .nf-panel{display:none}
 nav.nf.nf-on{border-radius:24px;max-height:calc(100vh - 28px);max-height:calc(100dvh - 28px);overflow-y:auto;overscroll-behavior:contain;padding-bottom:12px}
 nav.nf.nf-on .nf-panel{display:flex;flex-direction:column;align-items:stretch;flex-basis:100%;gap:6px;padding:10px 2px 0}
 nav.nf .nf-has>.nf-top{display:none}
 nav.nf .nf-menu{position:static;transform:none;width:auto;padding:0;display:block}
 nav.nf .nf-card{grid-template-columns:1fr;border-radius:16px;box-shadow:none}
 nav.nf .nf-col+.nf-col{border-left:0;border-top:1px solid var(--nf-line)}
 nav.nf .nf-col{padding:12px 12px}
 nav.nf .nf-row{min-height:44px}
 nav.nf .nf-panel>.nf-top,nav.nf .nf-lang{display:flex;align-items:center;min-height:44px;padding:10px 14px;border-radius:14px;background:var(--nf-card);color:var(--nf-ink);border:1px solid var(--nf-line);font-size:.95rem;white-space:normal}
 nav.nf .nf-panel>.nf-top:hover{background:var(--nf-soft)}
 nav.nf .nf-lang a{display:inline-block;padding:10px 6px}
 nav.nf .nf-login{align-self:flex-start;margin:4px 0 0;min-height:44px;display:flex;align-items:center}
}
@media(prefers-reduced-motion:reduce){nav.nf,nav.nf *{transition:none!important;animation:none!important}}

@media(min-width:901px){
 nav.nf .nf-has{position:relative}
 nav.nf .nf-menu{left:0;transform:none;padding-top:16px}
}

/* M2: skip link stays off-screen until keyboard focus (all locales). */
a.skip:not(:focus){position:absolute!important;left:auto!important;top:auto!important;width:0!important;height:0!important;min-width:0!important;min-height:0!important;padding:0!important;border:0!important;overflow:hidden!important;transform:none!important}
a.skip:focus{position:fixed!important;left:12px!important;top:12px!important;width:auto!important;height:auto!important;overflow:visible!important;transform:none!important;z-index:2147483000;background:#fff;color:#111;padding:12px 16px;border:2px solid #111;border-radius:6px}
/* M2: anchor jumps stop below the sticky nav so headings are not covered. */
html:has(nav[data-nav-final]){scroll-padding-top:96px}
[data-home-sample] [id],[data-home-sample] h2{scroll-margin-top:96px}
/* M2: bare footers keep their link group wrapping on narrow screens. */
footer>span>a{display:inline-block;margin:0 .75em .25em 0}
