/* The site's top menu on its own (taken from site.css), for pages with their own styles: the user manual.
   Regenerate it if the menu in site.css changes. */
.nav{--bg:#F6F3EA; --paper:#FFFDF8; --tint:#EAF5F3; --ink:#22303C; --muted:#5B6673; --soft:#8A939D;
  --line:#E4DED0; --teal:#2FA6A0; --teal-d:#1F7F7A; --gold:#FFCF01; --gold-l:#FFF3BF; --gold-ink:#6E5600;
  --ok:#2E9A63; --ok-bg:#E2F4EA; --del:#C0453B; --del-bg:#FBE6E3;
  --display:'Gentium Book Plus',Georgia,'Times New Roman',serif;
  --body:'Figtree','Segoe UI',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,Menlo,monospace;
  --r:22px; --r-s:14px;
  --shadow:0 1px 2px rgba(34,48,60,.06),0 18px 40px -22px rgba(34,48,60,.28);;font:400 1.0625rem/1.6 var(--body);color:var(--ink)}
.nav *{box-sizing:border-box}
.nav a{color:inherit}
.nav .btn{display:inline-flex;align-items:center;gap:10px;padding:14px 24px;border-radius:999px;font:700 1rem/1 var(--body);text-decoration:none;border:2px solid transparent;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s}
.nav .btn:hover{transform:translateY(-2px)}
.nav .btn-gold{background:var(--gold);color:var(--ink)}
.nav .mark .s{fill:none;stroke:var(--ink);stroke-width:26}
.nav .mark .d{fill:var(--ink)}
.nav .mark .e{fill:var(--gold)}
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:rgba(246,243,234,.9);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;height:74px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand svg{width:40px;height:40px;flex:none}
.brand b{font:700 1.38rem/1 var(--display)}
.brand small{display:block;font-size:.72rem;color:var(--muted);margin-top:4px}
.nav ul{display:flex;gap:6px;list-style:none;margin:0;padding:0}
.nav ul a{display:block;padding:8px 13px;border-radius:999px;text-decoration:none;font-weight:600;font-size:.93rem;color:var(--muted)}
.nav ul a:hover{background:var(--paper);color:var(--ink)}
.nav ul a[aria-current="page"],.nav ul a.is-active{background:var(--paper);color:var(--teal-d);box-shadow:inset 0 0 0 1px var(--line)}
.nav .btn{padding:11px 18px;font-size:.92rem}
@media (max-width:1000px){.nav ul{display:none}}
@media (max-width:440px){.brand small{display:none}.nav .btn{padding:10px 14px}}
footer .brand svg{width:28px;height:28px}
footer .brand b{font-size:1.05rem}
.nav .tp-head{transform-box:view-box!important;transform-origin:100px 100px!important;animation:tp-tilt 7s ease-in-out infinite}
.nav .tp-look{animation:tp-look 7s ease-in-out infinite}
.nav .tp-blink{animation:tp-blink 7s linear infinite}
.nav .tp-dot{animation:tp-hop 7s ease-in-out infinite}
@keyframes tp-blink{0%,30%,34%,76%,79%,82%,100%{transform:scaleY(1)}32%,77.5%,80.5%{transform:scaleY(.12)}}
@keyframes tp-look{0%,8%{transform:translate(0,0)}14%,26%{transform:translate(-9px,2px)}32%,50%{transform:translate(0,0)}56%,68%{transform:translate(7px,-8px)}74%,100%{transform:translate(0,0)}}
@keyframes tp-tilt{0%,52%{transform:rotate(0)}58%,68%{transform:rotate(-6deg)}74%,100%{transform:rotate(0)}}
@keyframes tp-hop{0%,84%{transform:translateY(0)}87%{transform:translateY(-12px)}90%{transform:translateY(0)}92%{transform:translateY(-6px)}94%,100%{transform:translateY(0)}}
.brand .logo-anim{width:46px;height:46px;overflow:visible}
.nav .logo-anim .tp-head,.nav .logo-anim .tp-look,.nav .logo-anim .tp-blink,.nav .logo-anim .tp-dot{animation-duration:5s!important;animation-delay:1.6s!important}
.nav .logo-anim .tp-head{animation-name:tp-tilt!important;animation-iteration-count:infinite!important}
.nav .logo-anim .tp-look{animation-name:tp-look!important;animation-iteration-count:infinite!important}
.nav .logo-anim .tp-blink{animation-name:tp-blink!important;animation-iteration-count:infinite!important}
.nav .logo-anim .tp-dot{animation-name:tp-hop!important;animation-iteration-count:infinite!important}
.nav .logo-anim .b-drop{animation:b-drop .6s cubic-bezier(.3,1.4,.5,1) both!important}
.nav .logo-anim .b-draw{stroke-dasharray:100;animation:b-draw .7s ease-in-out .35s both!important}
.nav .logo-anim .b-pop1{animation:b-pop .45s ease-out 1s both!important}
.nav .logo-anim .b-pop2{animation:b-pop .45s ease-out 1.2s both!important}
.brand:hover .logo-anim .tp-head{animation:hello 1s ease-in-out!important;transform-box:view-box!important;transform-origin:100px 180px!important}
@keyframes b-drop{0%{transform:translateY(-70px);opacity:0}100%{transform:translateY(0);opacity:1}}
@keyframes b-draw{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes b-pop{0%{transform:scale(0)}65%{transform:scale(1.35)}100%{transform:scale(1)}}
@keyframes hello{0%{transform:translateY(0) rotate(0)}30%{transform:translateY(-14px) rotate(-6deg)}60%{transform:translateY(0) rotate(0)}80%{transform:translateY(-5px) rotate(3deg)}100%{transform:translateY(0) rotate(0)}}
.nav .logo-anim .tp-head{animation-name:nav-tilt!important;animation-duration:4s!important}
.nav .logo-anim .tp-look{animation-name:nav-look!important;animation-duration:4s!important}
.nav .logo-anim .tp-blink{animation-name:nav-blink!important;animation-duration:4s!important}
.nav .logo-anim .tp-dot{animation-name:nav-hop!important;animation-duration:4s!important}
@keyframes nav-tilt{0%,45%{transform:rotate(0)}52%,66%{transform:rotate(-12deg)}74%,100%{transform:rotate(0)}}
@keyframes nav-look{0%,6%{transform:translate(0,0)}12%,26%{transform:translate(-12px,4px)}32%,40%{transform:translate(0,0)}52%,66%{transform:translate(10px,-10px)}74%,100%{transform:translate(0,0)}}
@keyframes nav-blink{0%,34%,40%,86%,89%,92%,100%{transform:scaleY(1)}37%,87.5%,90.5%{transform:scaleY(.1)}}
@keyframes nav-hop{0%,76%{transform:translateY(0)}80%{transform:translateY(-22px)}84%{transform:translateY(0)}87%{transform:translateY(-10px)}90%,100%{transform:translateY(0)}}
.nav-actions{display:flex;align-items:center;gap:16px}
.nav-signin{font-weight:600;font-size:.95rem;text-decoration:none;color:var(--ink);padding:8px 4px}
.nav-signin:hover{text-decoration:underline;text-underline-offset:4px}
@media (max-width:440px){.nav-signin{font-size:.9rem}}
.nav .lockup{display:flex;flex-direction:column;gap:5px;min-width:0}
.nav .lk-name{font:700 2rem/1 var(--display);color:var(--ink);white-space:nowrap;letter-spacing:.005em}
.nav .lk-dot{display:inline-block;transform:scale(1.35);margin:0 .02em}
.nav .lk-ai{color:#FFCF01}
.nav .lk-tag{display:flex;align-items:center;gap:.45rem;font:italic 400 .8rem/1 var(--display);letter-spacing:.06em;color:var(--muted);white-space:nowrap}
.nav .lk-tag i{width:14px;height:3px;border-radius:2px;background:#6FA8A0;flex:none}
.nav .brand .logo-anim{width:50px;height:58px}
.nav .wrap{height:84px}
footer .lockup{gap:4px}
footer .lk-name{font-size:1.45rem}
footer .lk-tag{font-size:.72rem}
@media (max-width:440px){.nav .lk-name{font-size:1.6rem}.nav .lk-tag{font-size:.7rem}.nav .brand .logo-anim{width:40px;height:46px}}
.nav-account{padding:6px 2px;text-decoration:none;font-weight:600;font-size:.95rem;color:var(--ink);
  border-bottom:3px solid var(--gold)}
.nav-account:hover{color:var(--teal-d)}
.nav-logout{margin:0}
.nav-logout .btn{border-radius:8px;text-transform:uppercase;letter-spacing:.1em;font-size:.74rem;padding:9px 15px;
  box-shadow:0 4px 10px -6px rgba(224,174,0,.8)}
.nav-logout .btn:hover{box-shadow:0 6px 14px -6px rgba(224,174,0,.9)}
.nav ul a,.nav-actions a,.nav-actions button{white-space:nowrap}
@media (max-width:440px){.nav-logout .btn{padding:8px 12px}}
@media (max-width:1200px){.nav ul a{padding:8px 8px}.nav .wrap{gap:14px}.nav-actions{gap:12px}}
@media (max-width:1100px) and (min-width:1001px){.nav .lk-tag{display:none}}
@media (max-width:440px){.nav .lk-tag{display:none}.nav-actions a{white-space:nowrap}}
.nav .btn-gold{box-shadow:0 10px 22px -10px rgba(224,174,0,.75)}
.nav .btn-gold:hover{background:#F5C400}
.nav ul li.has-sub{position:relative}
.nav ul .sub{display:none;position:absolute;left:0;top:100%;flex-direction:column;gap:2px;min-width:180px;padding:8px;margin-top:6px;
  background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 30px -14px rgba(34,48,60,.35);z-index:30}
.nav ul .sub::before{content:"";position:absolute;left:0;right:0;top:-8px;height:8px}
.nav ul li.has-sub:hover > .sub,.nav ul li.has-sub:focus-within > .sub{display:flex}
.nav ul .sub a{border-radius:9px;padding:9px 12px;color:var(--ink)}
.nav ul .sub a:hover{background:var(--bg,#F6F3EA);color:var(--teal-d)}
.nav .wrap{max-width:1180px;margin-inline:auto;padding-inline:clamp(16px,4vw,40px)}